jQuery Как добавить обработчик в класс, но только если он еще не установлен?

Question

У меня есть ряд узлов, в которые я хочу добавить обработчик кликов, узлы будут переключаться на действие, один раз щелкнуть и что-то установить, снова щелкнуть и очистить.

Проблема заключается в том, что один и тот же обработчик устанавливается несколько раз, поэтому один клик приводит к вызовам обработчика.

Как проверить, установлен ли обработчик для класса, а затем установить только в том случае, если он еще не установлен?

Я знаю, что к этому уже есть похожие сообщения, однако, прочитав их, я не смог найти тот, который решает мою проблему, когда я устанавливаю обработчик для класса.

[Edit], мой код:

//Need to detect is handler has already been installed before adding the handler below: 
    $('.btnExpCol').click(function() { 
    //Do something when any element with this class is clicked 
    }); 

Много замечаний основаны вокруг «ид», который, если вы перечитайте мой пост, я использую селектор «класс», однако проблема была решена, и решение работает хорошо.

[Новый код, который сейчас работает]:

$('.btnExpCol').off("click").on("click", function() { 
    //Do something when any element the has this class is clicked 
    }); 

Answer 1

попробовать unbinding первый и binding снова

$("#id").unbind("click").bind("click",function(){... 

предпочитают это (спасибо @charlietf)

$("#someid").off("click").on("click",function(){... 

Answer 2

Есть несколько подходов, которые могли бы работать. 1) Измените элемент при установке обработчика (добавьте класс) и используйте: not (.hashandler) при добавлении, чтобы вы не добавляли дважды.

2) Не делайте этого. Вместо этого просто добавьте один обработчик (когда-либо) к корню, $ (document) .on ('click', '. Myclass', function() {...});

Любые элементы «myclass» будут запускать функцию при нажатии.

Answer 3

Я бы отключить его off, а затем добавить его снова с on.

Но если вы хотите, чтобы пойти на это, это должно дать вам отправную точку:

<a href="#" id="link">Link</a> 

$("#link").on("click", function(e){ 
    alert("link clicked"); 
}); 

$.each($._data($("#link")[0], "events"),function(i, v){ 
    if(v[0].type === "click") { 
     alert("the click handler is set, do not add new"); 
    } 
}); 

https://jsfiddle.net/nygy1s9j/10/

идеи взяты из this question, проверенную с JQuery 3.1.1