Question

我有一个场景，我有这样的代码

HTML

<input type="submit" value="" name="submit" id="slider1">

SCRIPT

$(document).ready(function() {
   $("#slider1").Slider();
});

当文档加载时，我的Slider()函数会在输入框中完成一些操作我面临的问题是，在ajax返回时替换相同的输入框html并且无法调用我的Slider()。

AJAX RETURN

...
success: function(data) {
   // This was removing the wrapper element, all the other calls
   // to $('#slider1') were doing nothing
   //$("#slider1").remove();
   $("#slider1").html('<input type="submit" value="{{ some variable }}" name="submit" id="slider1">');
}
...

我想在输入框中调用Slider()函数以便调用它，

类似的东西：

    $("#slider1").html('<input type="submit" callSliderFunction="Slider()"  value="{{ some variable }}" name="submit" id="slider1">');

可以在那里打电话吗？如果不是我怎样才能做到这一点？感谢

Answer 1

在将成功函数添加到页面后，我会再次调用.Slider（）。

success: function(data) {
   $("#slider1").remove();
   $("#slider1").html('<input type="submit" value="{{ some variable }}" name="submit" id="slider1">');
   $("#slider1").Slider();
}

正如Juan指出的那样，一旦你.remove（）它就不能在＃slider1上调用.html（）。通过查看你拥有的内容，我猜你正在尝试更改＃slider1的值，在这种情况下，这样做会更简单

success: function(data) {
   $("#slider1").attr("value", "{{ some variable }}");
   $("#slider1").Slider();
}

Answer 2

只需在更改html之后加载文档时调用它。

$("#slider1").Slider();

Answer 3

在您设置HTML

之后立即调用它

success: function(data) {
  var wrapper = $("#slider1");
  wrapper.html('<input type="submit" value="{{ some variable }}" name="submit"   id="slider1">');
  wrapper.Slider();
}

在ajax返回的html上调用jquery函数

3 个答案: