jQuery-Ui失去了功能後重新加載到頁

嘿，我有一個網站與表中的jQuery-UI obgects。我所做的是將表保存在localstorage中，這樣用戶可以加載不同的「項目」。jQuery-Ui失去了功能後重新加載到頁

現在加載保存的表格後，我還更新了我所有按鈕等的處理程序。在那之後工作正常。但是所有jQuery-Uis的功能都不再提供。我試圖在updateHandlers功能如下代碼：

//Initial setup for jQuery UI 
$('#infoImg').tooltip(); 
$('#volSlider').slider({ max: 100, min: 0});

，但這僅適用於在我的表元素的第一外觀。所有其他人不工作。

我只是一個初學者與jQuery和Javascript，也許我正在做一些完全錯誤的東西..但它是什麼？

我在updateHandler功能累其他的東西：

$(this).parent().find('.infoImg').tooltip(); 
$(this).parent().find('.volSlider').slider({ max: 100, min: 0});

但現在它不是任何一個工作..

的HTML是：

<img id="infoImg" src="images/info_s.png" height="30" width="30" title="What"> 
<div id="volSlider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" aria-disabled="false"><a class="ui-slider-handle ui-state-default ui-corner-all" href="#" style="left: 18%;"></a></div>

驗證碼重演在我的桌子上的每一排......

我現在也試過用.each（）好玩jQuery ..沒有成功：

$('.volSlider').each(function(index, elem) { 
       $(this).slider({ max: 100, min: 0}); 
      });

我很高興發佈額外的信息或代碼，如果你需要任何。

來源

2013-10-30 Hagbart Celine

我與每一個（）函數的幫助下做到了：

$.each($('.volSlider'), function() { 
     $(this).slider({ max: 100, min: 0}); 
       });

坦克@所有的幫助

來源

2013-10-30 10:39:33

在您的第一段代碼中：初始設置您通過編號$('#infoImt')選擇處理程序。在更新之後，您使用類選擇器$('.infoImg')。你不是指同一個對象。這就是爲什麼它不起作用。

只是單挑：確保任何現有元素先刪除其功能，然後再添加更新。

編輯

嘗試以下功能：

var initFn = function(){ 
    $('.infoImg.__new') 
    .tooltip() 
    .removeClass('__new'); 

    $('.volSlider.__new') 
    .slider({max:100,min:0}) 
    .removeClass('__new'); 
};

正如你可以看到，我添加了一個類：__new。這個班是'實際'選擇。這將確保您不會在同一元素上應用.tooltip()和.slider()兩次。你必須改變你的HTML中位和：

<img class="infoImg __new" src="images/info_s.png" height="30" width="30" title="What" /> 
<div class="volSlider __new ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" aria-disabled="false"> 
    <a class="ui-slider-handle ui-state-default ui-corner-all" href="#" style="left: 18%;"></a> 
</div>

請注意，我已經改變了id爲class，並且我已經添加了__new類。讓我知道這個是否奏效。

來源

2013-10-30 09:40:29 LuudJacobs

我的英文不是最好的抱歉..但我所做的是取代我的表的innerHTML與保存的一樣。所以之後，我的所有滑動條和工具提示都不起作用了。在我的初始設置中，只有我的工具提示和滑塊的第一次出現再次工作，所有其他人不.. –

我試過它與「$（this）.parent（）。find（'#infoImg'）.tooltip（）;」但它沒有區別。 –

這可能是因爲這些元素不在你的查詢指向的位置（'$（this）.parent（）。find（...'）。還要注意重複的ID：你不能在兩個上使用相同的ID不同的元素 – LuudJacobs

變化是：

//Initial setup for jQuery UI 

$('#infoImg').tooltip(); 
$('#volSlider').slider({ max: 100, min: 0});

這樣：

$('.infoImg').tooltip(); 
$('.volSlider').slider({ max: 100, min: 0});

來源

2013-10-30 10:24:15

問題是，它只適用於infoImg的第一次出現..我可以告訴你完整的HTML塊..將立即編輯。。我還將infoImg更改爲不再具有ID –

ID在文檔中必須是唯一的，因此請更改class =「inf」上的所有id =「infoImg」 oImg「和id =」volSlider「在class =」volSlider「之後，第一段代碼修復爲： $（'.infoImg'）.tooltip（）; $（'.volSlider'）.slider（{max：100，min：0}）; 然後嘗試 –

jQuery-Ui失去了功能後重新加載到頁

回答

相關問題