用於跳轉/單擊的jQuery/jQuery UI滑塊事件。功能不費一槍

我通過的div的集合創建一個jQuery滑塊循環，如果我按住滑塊並拖動它，並放手。 handleSlider（）被調用。如果我點擊滑塊中的一個隨機點，該函數永遠不會被調用。我嘗試過使用其他兩種事件類型，但都沒有運氣。是否有一個事件處理程序，用於「滑動時用戶單擊/跳轉」滑塊？用於跳轉/單擊的jQuery/jQuery UI滑塊事件。功能不費一槍

$("#video_seek").slider({ 
     range: "max", 
     step: 1, 
     slide: function(event, ui) { 
     handleSlider(); 
     } 
    }); 
$("#video_seek").slider({ stop: function(event, ui) {handleSlider();}}); 
$("#video_seek").slider({ change: function(event, ui) {handleSlider();}});

來源

2012-02-18 JustAnotherDeveloper

我敢肯定，變化應在這裏工作（ http://jsfiddle.net/zAzvL/）。那不是你所看到的行爲嗎？ – 2012-02-18 22:06:49

@AndrewWhitaker更好但不完美，我拿出了功能。我想我有一個函數在滑塊完成更新之前觸發。 – JustAnotherDeveloper 2012-02-18 22:20:35

每次滑動時，「滑動」都會觸發鼠標移動。這可能是問題嗎？ – 2012-02-18 22:22:19

我相信你的問題是在語法。每次使用$它使一個新的jQuery對象，所以

$("#video_seek").slider({ 
     range: "max", 
     step: 1, 
     slide: function(event, ui) { 
     handleSlider(); 
     } 
    }); 
//below are not necessarily referring to the original slider, but rather creating new sliders. 
$("#video_seek").slider({ stop: function(event, ui) {handleSlider();}}); 
$("#video_seek").slider({ change: function(event, ui) {handleSlider();}});

@Andrew是在他的語法正確。所有你應該需要的是「改變」的事件，你可以在你原有的申報設置是這樣的：

$("#video_seek").slider({ 
    change: function(event, ui) { 
     handleSlider(); 
    } 
});

，甚至是這樣的：

$("#video_seek").slider({ 
    change: handleSlider 
});

，如果你需要後附加一個事件處理程序事實上，這樣做是這樣的：

$("#video_seek").bind("slidechange", function(event, ui) { 
    handleSlider(); 
});

甚至：

$("#video_seek").bind("slidechange", handleSlider);

（編輯）

全部放在一起，並避免產生後續的jQuery對象。

var videoSeek = $('#video_seek'); 
videoSeek.slider({ 
    slide: handleSlider 
}); 
//added later on not necessary just for example of doing so 
videoSeek.bind('slidechange', handleSlider); 

function handleSlider(event, ui){ 
    //do stuff 
}

來源

2012-02-18 22:19:41 Fresheyeball

謝謝！很好的幫助。我沒有意識到它每次都創造了這個對象，我更多地把它當作一個選擇器來對待！ – JustAnotherDeveloper 2012-02-21 10:45:22

這是一個額外的提示，真的有助於程序內存。如果你打算多次選擇相同的東西，請將你的jquery對象保存在一個javascript var中，如下所示：var elem = $（'＃elem'）;然後elem.css（'background'，'red'）; elem.hide（）;管他呢。 – Fresheyeball 2012-02-21 15:49:59

我編輯了我的答案以顯示原理。 – Fresheyeball 2012-02-21 15:55:53

您需要設置實際的對象創建的內部事件或之後將它們綁定...

$("#video_seek").slider({ 
    range: "max", 
    step: 1, 
    slide: function(event, ui) {handleSlider();} 
    stop: function(event, ui) {handleSlider();} 
    change: function(event, ui) {handleSlider();} 
});

或：

$("#video_seek").slider({ 
    range: "max", 
    step: 1, 
}); 

$("#video_seek").bind("slidechange", function(event, ui) { 
    handleSlider(); 
});

來源

2012-02-18 22:21:34

用於跳轉/單擊的jQuery/jQuery UI滑塊事件。功能不費一槍

回答

相關問題