2014-05-21 207 views
1

我一直試圖刪除點擊事件處理程序後點擊一次,以防止事件多次發射。點擊後立即刪除點擊事件處理程序

我試過.unbind().off().one()並把每個在功能的各個不同的地方,但似乎沒有工作。

如果我使用.off(),我得到一個undefined is not a function錯誤。

如果我使用.one()如果我點擊另一個按鈕,我想基本上打開事件。所以如果我點擊選擇,我希望它只觸發一次,但如果我然後點擊取消選擇,我想選擇再次點擊。

我試過做下面的事,但奇怪的代碼甚至沒有觸發,所以我一直被迫使用click()

$().on('click', function()... 

我應該使用哪個函數,應該在哪裏放?

(function($) { 

Drupal.behaviors.wysiwyg = { 
    attach: function(context, settings) { 

     var toggle = function(state) { 
      $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
     } 

     $('#wysiwyg-select-all').click(function(){ 
    toggle(true); 
      return false; 
     }); 

     $('#wysiwyg-unselect-all').click(function(){ 
    toggle(false); 
      return false; 
     }); 
    } 
} 

}(jQuery)) 
+0

_If我使用.off()我得到一個未定義不是函數錯誤._您正在使用哪個版本的jQuery? – Satpal

+0

@Satpal版本1.9 – Keven

+0

除非您共享該代碼,否則我們無法告訴您使用'.off()'或'.one()'有什麼問題。 – Blazemonger

回答

1

檢查是否適用於您。還要確保jquery版本在「開」,「關」工作時高於1.7。

(function($) { 

    Drupal.behaviors.wysiwyg = { 
    attach: function(context, settings) { 
    var counter = 0; 
     var toggle = function(state) { 
     $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
     } 

     $(document).off('click',"#wysiwyg-select-all").on('click', "#wysiwyg-select-all", function(e) { 
     toggle(true);    
     return false; 
     }); 

     $(document).off('click',"#wysiwyg-unselect-all").on('click', "#wysiwyg-unselect-all", function(e) { 
     toggle(false);  
     return false; 
     }); 
    } 
    } 

}(jQuery)) 
+0

感謝您詢問我的jQuery版本是否高於1.7。我意識到事實上,我的版本太低了。一旦我更新到1.9,我不再有'.on('click')'的未定義錯誤,所以現在'.off()''.on()'工作。我喜歡這種情況下的鏈接,所以我會給你。 – Keven

0

事情是這樣的:

$("#wysiwyg-select-all").one("click", function() { 
    toggle(true); 
    return false; 
}); 
+0

我剛剛更新了我的問題,但是如果我使用'.one()'我想要事件被再次觸發,如果其他事件被觸發。合理? – Keven

+0

那麼...重新綁定它?你是那個說你想解除它的人。 –

+0

我試過重新綁定它無濟於事。在這種情況下我會怎麼做?創建一個包裝函數,然後在事件內部調用它? – Keven

0

添加一個類名點擊按鈕,然後刪除類一旦其點擊一次。

$('#wysiwyg-select-all .myclassname').on('click', function(){ 
    toggle(true); 
    $(this).removeClass('myclassname'); 
    $('#wysiwyg-unselect-all').addClass('secondclassname'); 
    return false; 
}); 

$('#wysiwyg-unselect-all .secondclassname').on('click', function(){ 
    toggle(false); 
    $('#wysiwyg-select-all').addClass('myclassname'); 
    $(this).removeClass('secondclassname'); 
    return false; 
}); 
+1

除非您使用事件委派,否則這將不起作用。 – Barmar

0

這應該用於動態創建的元素工作:

(function ($) { 

    Drupal.behaviors.wysiwyg = { 
     attach: function (context, settings) { 

      var toggle = function (state) { 
       $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
      }; 

      $(document).on("click", "#wysiwyg-select-all", selectFn()); 
      $(document).on("click", "#wysiwyg-unselect-all", unselectFn()); 
     } 
    }; 

}(jQuery)); 


function selectFn() { 
    $(document).off("click", '#wysiwyg-select-all', "**"); 
    $(document).on("click", "#wysiwyg-unselect-all", unselectFn()); 
    toggle(true); 
    return false; 
} 

function unselectFn() { 
    $(document).off("click", '#wysiwyg-unselect-all', "**"); 
    $(document).on("click", "#wysiwyg-select-all", selectFn()); 
    toggle(false); 
    return false; 
} 
+0

我試過了。它拋出'Uncaught TypeError:未定義不是函數'錯誤。 – Keven

+0

已更新爲@aecend評論 – MattSizzle

+0

更新爲動態元素 – MattSizzle

1

修訂

我與幾個其他這些傢伙們暗示的東西亂搞,我認爲這正是你需要做什麼:

(function ($) { 

    Drupal.behaviors.wysiwyg = { 
     attach: function (context, settings) { 

      var selectFn = function() { 
       toggle(true); 
       return false; 
      } 

      var unselectFn = function() { 
       toggle(false); 
       return false; 
      }  

      var toggle = function (state) { 
       $('#wysiwyg-profile-form .buttons-and-plugins input:checkbox').attr('checked', state); 
       if (state) { 
        $(document).off("click", '#wysiwyg-select-all,#wysiwyg-unselect-all', "**"); 
        $(document).on("click", "#wysiwyg-unselect-all", unselectFn; 
       }else{ 
        $(document).off("click", '#wysiwyg-select-all,#wysiwyg-unselect-all', "**"); 
        $(document).on("click", "#wysiwyg-select-all", selectFn; 
       } 
      }; 

      $(document).on("click", "#wysiwyg-select-all", selectFn); 
      $(document).on("click", "#wysiwyg-unselect-all", unselectFn); 

     } 
    }; 

}(jQuery)); 

它切換按鈕事件的綁定,並將與動態創建的元素一起使用。這是Matt Green的答案的一個衍生物,但我注意到他的幾個問題,即他在事件綁定中調用selectFn和unselectFn而不是引用它們。

+0

第二個不適合我...它仍然進入循環。 – Keven

+0

@Kevin,我改變了它存儲引用的方式並將變量移入全局範圍。你介意嘗試嗎? – aecend

+0

我做了你所說的,並且它不再擊中'toggle(true)',但是,這並不意味着點擊甚至還沒有被解僱?它看起來像點擊事件仍然被擊中,但當它被擊中時沒有任何反應。 – Keven

0

爲什麼不使用任何全局變量作爲標誌。點擊事件設置爲true。

if (btn1Clicked) 
    return; 
btn1Clicked=true; 

並重新啓用只是將其設置爲false。 如果需要,您可以使用return false而不是return。

+0

「爲什麼不使用任何全局變量作爲標誌」,因爲應該避免使用全局變量,除非絕對需要 – MattSizzle

+0

@MattGreen以及它爲什麼如此。 –

+0

如果全局變量在您認爲是唯一的名稱空間中受到保護,則可以使用全局變量,並且僅在有益時才使用。主要問題是全局變量可能使一段代碼更可能與其他代碼片段發生衝突(如果不使用不同的名稱空間或非常獨特的名稱)。出於這個原因和其他原因,最好在實際上不需要時避免全局變量。 – MattSizzle

相關問題