jQuery克隆jQueryUI滑塊怪異行爲

在頁面上，當用戶填充搜索框時，我添加了一個搜索結果div與克隆行（withDataAndEvents = true）與jQuery。其中一些行包含表單元素和一些jQuery UI滑塊。這些元素的事件與knockoutJS的數據綁定功能綁定。常規表單元素上的事件處理程序正常工作，但不適用於jQuery UI滑塊。拖動手柄時，它會跳回原始行。jQuery克隆jQueryUI滑塊怪異行爲

某些代碼：通過一些div（行）和，添加它們逐個結果面板通過克隆它們

$(divselector).each(function (i, div) { 
    if (arrPropertyGuids.indexOf($(div).attr("data-propertyguid")) == -1) { 
     $("#propertiesSearchPanel").append($(div).clone(true).show()); 
    } 
});

餘環路（也試過深克隆無差異）。一些div隱藏在源代碼中，所以我需要調用.show（）。

我所做的嘗試：

試圖重新initiliaze滑塊。但沒有檢測到不同的行爲。
試圖摧毀和初始化克隆後的滑塊，但是這給出了一個錯誤：

cannot call methods on slider prior to initialization; attempted to call method 'destroy'

$(".range-slider").slider("destroy");

所以，在我看來，在這種或那種方式，克隆的滑塊不是「真正的」jQuery UI滑塊，但仍然與原始元素相關聯。

任何人有一個想法如何解決這個問題？

來源

2013-05-03 JurgenStillaert

我有一個工作解決方案，但不是一個理想的。所以我會留下這個問題以防有人可能有更好的答案。

我簡單地刪除了所有滑塊並重新添加了div標籤。之後，我重新應用了jQuery UI滑塊init函數。

$("#propertiesSearchPanel").find(".range-slider").remove(); 
     $("#propertiesSearchPanel .range-box").each(function (i, tb) { 
      $(tb).next("label").after('<div class="range-slider"></div>'); 
     } 
}); 
sliders($("#propertiesSearchPanel")); //init functions for sliders

來源

2013-05-03 09:49:06 JurgenStillaert

jQuery克隆jQueryUI滑塊怪異行爲

回答

相關問題