當使用jQuery UI時評級滑塊沒有觸發

我試圖讓滑塊在jQuery UI網站上工作。它在加載頁面時可以正常工作，但是在主頁上啓動並瀏覽到該頁面時，滑塊不會運行。所有JS代碼都位於每個頁面上加載的.js文件中;包括首頁。我知道jQuery UI使ajax體驗，因此它不會加載整個頁面，所以保持.js中所需的代碼應該允許它運行;我認爲。我一直在看這一段時間，我失去了一些非常基本的理解在這個我猜。當使用jQuery UI時評級滑塊沒有觸發

如何工作時，滑塊看起來：

代碼：

<div class="spacer-b20 TextSliderBox"> 
    <label class="field"> 
     <input type="text" id="slider1value" name="slider1value" class="gui-input" value="1"> 
     <input type="text" name="EventID" class="TextSliderBox" value=""> 
     <div id="slider1"></div> 
    </label> 
</div>

在網站.js文件：

$(function() { 
    $("#slider1").slider({ 
    value:1, 
    min: 1, 
    max: 5, 
    step: 1, 
    range: "max", 
    slide: function(event, ui) { 
     $("#slider1value").val(ui.value); 
    } 
}); 
});

來源

2017-10-20 Web Guy

只是澄清 - 你是否創建了兩個頁面（主頁和page2，我們會說），當通過URL加載page2時，滑塊可以工作，但是當加載主頁並點擊一個按鈕，然後通過AJAX加載page2時，滑塊不起作用？ –

@ mark.hch這是正確的。 –

好的。然後我的假設是你在主頁和page2上都包含了jQuery和jQuery UI，因此庫加載了兩次。在加載page2的AJAX調用中，可以在URL之後使用選擇器來加載'.TextSliderBox'元素（這樣它只加載該元素並去掉任何附加的'

我結束了移動一些功能的.js文件，並用不同的滑塊，是基於CSS去。現在效果很好。

來源

2017-10-24 17:30:20

相關問題