以编程方式添加jQuery UI滑块导致问题

我正在添加一个div以编程方式用作滑块，但是当我将滑块应用于它时，所有内容都会显示，但我无法拖动该手柄，也无法执行任何悬浮状态正常工作。以编程方式添加jQuery UI滑块导致问题

var container = $('<div class="container"></div>'); 
var slider_div = $('<div class="position_slider"></div>'); 

$(slider_div).slider(); 

container.append(slider_div); 
$placeholder = $("#"+player_id); 
$placeholder.append(container);

我试着将滑块的div无济于事的组合的所有号码，我只是想知道，如果有件事情我不知道，我已经错过了。在页面上实际添加<div class="position_slider">可以使滑块工作，但这不是一个选项。

任何帮助，将不胜感激。

来源

2010-03-09 Wil

您的容器和slider_div引用的是页面中的实际标记，而不是您想要插入页面的HTML片段。那是你的意思吗？如果是这样，那么追加为你添加了什么？ – Lazarus 2010-03-09 15:39:07

这个append可以很好的工作，并且滑块可以被构建 - 我可以在div上看到所有的小UI类，并且手柄在那里，你无法拖动它。当你点击它时，滑块不会用'ui-active'等更新。 – Wil 2010-03-09 15:56:36

问题是与jquery.flash在实例化滑块后更改容器DIV。我只是改变了从构建滑块的顺序，追加到容器，插入闪光灯到构建滑块，插入闪光灯，追加滑块。

如果您在查看滑块和所有ui组件时遇到问题，但无法操作，请尝试从页面中除去需要完成滑块的所有其他jquery，然后将它们一个接一个地加回去，直到你发现这个gremlin。

来源

2010-03-12 09:29:48 Wil

我认为这将清理这应该是什么样子：

var container = '<div class="container"></div>'; 
var slider_div = '<div class="position_slider"></div>'; 

$("#"+player_id).append(container); 
$(".container").append(slider_div); 
$(".position_slider").slider();

我知道你可能希望创建每页许多滑块，因此编程访问，并为我改变类引用ID引用并使用某种计数器为控件创建增量ID。我将把实际的实施作为一项练习。

来源

2010-03-09 15:44:21 Lazarus

是的，你将不得不原谅混乱，就像我说我一直在修修补补，所以它都有点不合适。实际上容器中还有很多东西，我刚刚在这个例子中删除了它。所以你说滑块应该都有唯一的ID才能正常工作？ – Wil 2010-03-09 15:48:30

我认为我们必须看到更多的代码才能够确切地知道，但我尝试为常见的视觉装饰保留课程，而不是用作控制参考。对我而言，控件具有特定的用途，因此需要特定的ID。 – Lazarus 2010-03-09 16:02:08

这些控件都工作正常，他们由他们的父母识别。这是这个滑块，让我头痛。我会一起得到一个更简单的例子并发布。 – Wil 2010-03-11 13:35:48

对于任何其他人谁发现了这个网页，我遇到了类似的问题。

这产生了一个看起来不错但不能操作的滑块。

var mySlider = $("<div/>").slider(); 
$(mySlider).clone().appendTo(SomeDiv);

用slider()注册新滑块解决了问题。

var mySlider = $("<div/>").slider(); 
$(mySlider).clone().slider().appendTo(SomeDiv);

来源

2012-09-13 01:42:04 Aesthete

以编程方式添加jQuery UI滑块导致问题

回答

相关问题