[英]How to concise following jquery code snippet
我有以下jQuery代碼,它工作正常,但加載速度很慢。 我不是jQuery專家,所以有人可以幫助我使以下代碼段更簡潔嗎? 我將不勝感激。
jQuery(document).ready(function() {
// colorpicker field
jQuery('.twb_btn_color, .twb_spam_clr, .twb_btn_txt_color, .twb_bg_color, .twb_main_title_color, .twb_sub_title_color')
.each(function(){
var $this = jQuery(this),
id = $this.attr('rel');
$this.farbtastic('#' + id).hide();
jQuery('.twb, .twb-title').click(function() {
jQuery('.twb_btn_color').fadeIn('medium').siblings("div").hide();
});
jQuery('.twb-spam, .twb-spam-title').click(function() {
jQuery('.twb_spam_clr').fadeIn('medium').siblings("div").hide();
});
jQuery('.twb-btn-txt-color, .twb-btn-txt-color-title').click(function() {
jQuery('.twb_btn_txt_color').fadeIn('medium').siblings("div").hide();
});
jQuery('.twb-bg-color, .twb-bg-color-title').click(function() {
jQuery('.twb_bg_color').fadeIn('medium').siblings("div").hide();
});
jQuery('.twb-main-title-color, .twb-main-title-color').click(function() {
jQuery('.twb_main_title_color').fadeIn('medium').siblings("div").hide();
});
jQuery('.twb-sub-title-color, .twb-sub-title-color').click(function() {
jQuery('.twb_sub_title_color').fadeIn('medium').siblings("div").hide();
});
});
});
處理此問題的典型方法是為要在相同的類名上執行相同操作的所有元素賦值 。
另外,為了不必將事件綁定到每個事件,可以將事件委托給公共父對象,在這種情況下,我們將使用body
:
$('body').on('click', '.common-class-name', function () {
$(this).fadeIn('medium').siblings("div").hide();
});
這要求您為所有元素賦予相同的類名。 然后,您可以引用$(this)
單擊的那個。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.