javascript - 尽管有多次附加，但 Jquery 事件函数触发一次

Question

我怎样才能做到这一点

html

   <button id="onclickpopupmenu">Test</button>
   <button id="popupmenuok"></button>

javascript:

$("#onclickpopupmenu").bind("click",function(){

  alert("this can execute multiple times")
  $("#popmenuok").bind("click",function(){
    alert("this has to be triggered only once eventhough the parent event trigger multiple times")
  })
})

请帮我...

Answer 1

只绑定一次处理程序：

var popupmenuBound = false;

$("#onclickpopupmenu").bind("click",function(){
  alert("this can execute multiple times");
  if (!popupmenuBound) {
    $("#popupmenuok").bind("click",function(){
      alert("this has to be triggered only once eventhough the parent event trigger multiple times");
    });
    popupmenuBound = true;
  }
});

Answer 2

有几种方法可以潜在地解释您想要的内容。

第一个是对第一个按钮的多次单击，这会在第二个按钮上产生一个单一但持久的（它对每次单击作出反应）事件处理程序。为此，您可以这样做：

$('#onclickpopupmenu').click(function() {
    // alert
    $('#popupmenuok').off('click').on('click', function() {
        // alert
    });
});

jsFiddle 演示

第二个是多次单击第一个按钮，每次单击都会在第二个按钮上获得一个一次性事件处理程序。因此，如果您单击第一个按钮一次，然后单击第二个按钮，您会收到一个警报，但再次单击第二个按钮没有任何作用。要做到这一点：

$('#onclickpopupmenu').click(function() {
    // alert
    $('#popupmenuok').off('click').one('click', function() {
        // alert
    });
});

jsFiddle 演示

Answer 3

$("#onclickpopupmenu").bind("click",function(){
  alert("this can execute multiple times");
});

$("#popupmenuok").one("click",function(){
  alert("this has to be triggered only once eventhough the parent event trigger multiple times");
});