取消绑定/关闭点击事件在jQuery中不起作用？

Question

使用jQuery（1.10），以解除绑定点击的事件：

function fnDoVoteContent() { 
    var btnUpvote = ".btn-upvoting"; 
    var btnDownVote = ".btn-downvoting"; 

    $(document).on('click', btnUpvote, function(){ 
     vote(param1, param2, param3); 
    }); 


    $(document).on('click', btnDownVote, function(){ 
     vote(param1, param2, param3); 
    }); 
} 

function vote(param1, param2, param3) { 

    $.ajax({ 
     url: votingUrl, 
     cache: false, 
     type: "POST", 
     dataType: "json", 
     beforeSend: function(){ 
      //do business logic 
      $("a").off("click"); // Line 1: Unbind clicked events 

     }, 
     complete: function(){ 
      //do business logic 
      $("a").on("click"); // Line 2: re-bind again 

     }, 
     success: function(data) { 
      //update data 
     } 
    }); 
} 

业务逻辑代码的工作，但在Line 1 and 2代码没有工作。难道我做错了什么？

Answer 1

这不是它的工作原理吗？你必须绑定和取消绑定到同一个选择器，并且你必须重新绑定到一个函数，只要做$('a').on('click')什么都不做。

为此，您可以使用名称空间的事件

function fnDoVoteContent() { 
    var btnUpvote = ".btn-upvoting"; 
    var btnDownVote = ".btn-downvoting"; 

    // bind event handlers 
    $(document).on('click.custom', btnUpvote, function(){ 
     vote(param1, param2, param3); 
    }); 

    $(document).on('click.custom', btnDownVote, function(){ 
     vote(param1, param2, param3); 
    }); 
} 

function vote(param1, param2, param3) { 

    $.ajax({ 
     url: votingUrl, 
     cache: false, 
     type: "POST", 
     dataType: "json", 
     beforeSend: function(){ 
      //do business logic 

      // unbind has to be done on the same selector 
      $(document).off('click.custom'); 

     }, 
     complete: function(){ 
      //do business logic 
      $(document).on('click.custom', btnUpvote, function(){ 
       vote(param1, param2, param3); 
      }); 

      $(document).on('click.custom', btnDownVote, function(){ 
       vote(param1, param2, param3); 
      }); 

     }, 
     success: function(data) { 
      //update data 
     } 
    }); 
}