jquery滑块通过ajax加载时不工作

Question

我正在使用jquery滑块插件来创建一些滑块。这项工作正常，当我直接加载它们时启动dom，但是当我尝试使用ajax innerHTML方法将滑块加载到div时，他们没有得到启动。

有没有什么知道我能做到这一点？

Answer 1

当您使用innerHTMl将滑块添加到div时，您必须再次调用滑块设置方法，以便在将滑块添加到div时将事件附加到滑块。 谢谢 Ashwani

Answer 2

尝试使用$ .ajax方法中的OnComplete属性来触发滑块的方法。这将确保该方法只会在ajax内容加载后触发。

Answer 3

通过设置对象的innerHTML创建滑块时，未对其进行初始化。 尝试此代替（为一个范围滑块）：

$.ajax({ 
    url: "get_slider.php", 
    success: function(data){ 
    if(typeof(data) == 'string') data = JSON.parse(data); 
    $('#my_slider_id').slider({ 
      range: true, 
      min: data.min, 
      max: data.max 
     }); 
    }, 
    error: function(data){ 
    // Something went wrong, do stuff here 
    } 
}); 

在这里，我们期望get_slider.php返回包含至少一个分钟，用于实例化所述滑块上的最大性能的JSON对象。

Answer 4

您必须重新启动/绑定您的活动。

e.g

//Ajax done and innerHTML is set 
$('container').slider(); //Just an example... this will bind events. 

或者

您可以更改事件处理程序.live。这处理动态内容。