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失去了功能后重新加载到页

回答

相关问题