停止jQuery雙重綁定點擊事件（最佳做法）

Question

這是我的問題。

我正在使用MVC，並在很多索引視圖中，我有一個帶有URL的「刪除」按鈕/徽標。所以我想讓這個刪除函數與jQuery和AJAX一起工作。

我的按鈕：

<a class="delbtn" href='<%= Url.Action("Delete", new {id=item.Vrst_ID}) %>'> 
         <img src="<%= Url.Content("~/img/cancel.png") %>" alt="Delete" width="16" /></a> 

每頁jQuery代碼：

 <script type="text/javascript"> 
      $(document).ready(function() { 

       $(".delbtn").click(function() { 
        var msg = "set " + $(this).parent().parent().find(".vrsttitel").text() + " "; 
        deleteConfirmation(msg, this); 
        return false; 
       }); 
      }); 
     </script> 

其中包括在js文件的代碼。

function deleteConfirmation(msg, handler) { 
    var showIt = function (hash) { 
     hash.w.find("#modaltekst").text(msg); 
     $("#delmodal #btnJa").click(function() { 
      $("#delmodal").jqmHide(); 
      setHighlight("Verwijderen..."); 
      $.post($(handler).attr("href"), null, function (data) { 
       if (data.succes) { 
        setHighlightOK("Verwijderd"); 
        $(handler).parent().parent().fadeOut("slow"); 
       } else { 
        if (data.error != "") { 
         setError(data.error); 
        } else { 
         setError("Verwijderen mislukt."); 
        } 
       } 
      }, "json"); 
     }); 

     $("#delmodal #btnNee").click(function() { 
      $("#delmodal").jqmHide(); 
     }); 

     $("#delmodal").show(); 
     return false; 
    }; 

    $("#delmodal").jqm({ onShow: showIt }).jqmShow(); 

} 

基本上這個工作，但我第二次刪除的東西，在$。員額被執行了兩次，因爲點擊功能被添加到$（「＃delmodal #btnJa」）的兩倍。

所以我想分開那些是和否按鈕（從deletemodal），但在'是'按鈕（#btnJa）我需要處理程序採取其URL。

爲了解決這個問題，我想在使用後取消綁定click事件，從而使它不會建立點擊事件，但我認爲這不是最佳實踐。

我應該怎麼做？

Answer 1

而是解除綁定/重新綁定你可以一次綁定按鈕和只存儲handler.href這是所有的使用$.data()和.data()這樣的改變在其他地方，例如：

$("#btnJa").click(function() { 
    $("#delmodal").jqmHide(); 
    setHighlight("Verwijderen..."); 
    var handler = $.data(this, 'handler'); 
    $.post(handler.attr('href'), function (data) { 
     if (data.succes) { 
      setHighlightOK("Verwijderd"); 
      handler.parent().parent().fadeOut("slow"); 
     } else { 
      if (data.error != "") { 
       setError(data.error); 
      } else { 
       setError("Verwijderen mislukt."); 
      } 
     } 
    }, "json"); 
}); 

$("#btnNee").click(function() { 
    $("#delmodal").jqmHide(); 
}); 

function deleteConfirmation(msg, handler) { 
    var showIt = function (hash) { 
     hash.w.find("#modaltekst").text(msg); 
     $("#btnJa").data('handler', $(handler)); 
     $("#delmodal").show(); 
     return false; 
    }; 

    $("#delmodal").jqm({ onShow: showIt }).jqmShow(); 
} 

這僅結合click處理程序一次，當你撥打deleteConfirmation我們存儲handler.href上#btnJa有一個數據屬性，所以每次你點擊另一個.delete它將更新$.post()去哪個頁面。

這裏的另外一個優化是，如果一個元素有一個ID使用只#ID的選擇，這是比任何其他選擇快很多......因爲它們必須是唯一的，就沒有必要包括家長或任何其他信息在選擇器真的:)