JQuery UI選項卡 - 通過ajax加載的選項卡的重新綁定事件

當通過ajax加載選項卡時，是否有正確的方式來重新綁定JQuery UI中的事件。例如，在下面的代碼中，我有成功事件調用了一個'initBinding（）'函數，它爲不同的類設置了一些自定義的單擊事件處理程序。這個問題是，當我切換標籤一堆，然後發射一個點擊事件，我得到了一些奇怪的屏幕閃爍效果。如果我刷新整個頁面，然後直接進入點擊事件，它不會閃爍。所以我認爲它與綁定多次有關。JQuery UI選項卡 - 通過ajax加載的選項卡的重新綁定事件

如果我將'initBinding（）'方法帶出成功事件，那麼通過ajax加載的任何選項卡都不會觸發我設置的任何事件。有沒有一種標準/更好的方式來處理這樣的綁定事件？

$(document).ready(function() { 
    $("#tabs").tabs({ 
     select: function (event, ui) { 
      var tabID = "#ui-tabs-" + (ui.index + 1); 
      $(tabID).html("<b>Fetching Data....Please wait....</b>"); 
     }, 
     ajaxOptions: { 
      error: function (xhr, status, index, anchor) { 
       $(anchor.hash).html("Could not load tab data"); 
      }, 
      success: function (xhr, status, index, anchor) { 
       initBinding(); 
      } 
     } 
    }); 
}); 
function initBinding() { 
    $(".editButton").click(function() { 
     //event logic... 
    }); 
}

來源

2011-07-07 Brosto

你應該使用jQuery的.live()到

附加一個處理程序的情況下爲當前選擇現在和將來匹配這，所有的元素。

在您的代碼：

$(".editButton").click(function() {

將成爲

$(".editButton").live('click', function() {

使用這種技術，可以完全消除initBinding()功能，並在onready功能使用.live()聲明。

來源

2011-07-07 14:59:19

謝謝，這工作完美！ – Brosto

是否有類似jquery ui方法綁定類的機制？例如，如果我有$（'div.accordion'）。accordion（）;.如果我通過帶有'accordion'類的div的ajax加載頁面，則不會加載手風琴效果。有沒有類似於live（）的情況？ – Brosto

從jQuery 1.7開始，不推薦使用.live（）方法。使用.on（）附加事件處理程序。 – DavidDraughn

JQuery UI選項卡 - 通過ajax加載的選項卡的重新綁定事件

回答

相關問題