在返回的html上的ajax上調用jquery函數

Question

我有一個這樣的代碼場景

HTML

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

腳本

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

當文檔加載時，我的Slider()函數對輸入框做了一些處理。
面臨的問題是，正在ajax返回上替換相同的輸入框html，而無法調用我的Slider() 。

AJAX返回

...
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所指出的那樣，一旦您刪除了它，就無法在＃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();
}