我使用这段代码每隔X秒刷新我的div:
<script>
$(document).ready(function() {
$("#container").load("stats.php");
var refreshId = setInterval(function() {
$("#container").load('stats.php');
}, 10*1000);
$.ajaxSetup({ cache: false });
});
</script>
这工作得很好,我唯一想添加的是一个滑块像这样:http://jqueryui.com/demos/slider/#steps
我希望它能够设置刷新定时器的间隔,默认为10秒(10*1000)
是否可以让滑块修改值?如果有,我该怎么做呢?
谢谢!
你的脚本应该是这样的:
$(document).ready(function() {
var intSeconds = 10;
var refreshId;
function sTimeout()
{
// Load content
$("#container").load("stats.php");
// Saving the timeout
refreshId = setTimeout(function() {
sTimout();
}, intSeconds *1000);
}
sTimeout();
$.ajaxSetup({ cache: false });
// The slider
$(".ui-slider").slider({
min : 1, // minimum value
max : 20, // Maximum value
value : intSeconds, // Copy current value
change: function(event, ui) {
clearTimeout(refreshId); // clear it
intSeconds = ui.value; // Update value
sTimeout(); // Restart it
}
});
});
现在只需添加一个滑块DIV到您的源代码,并检查它。
像这样添加滑块:
var interval = 10000;
$( "#slider" ).slider({
value:10,
min: 1,
max: 20,
step: 1,
slide: function( event, ui ) {
interval = ui.value * 1000;
}
});
那么你可以使用setTimeout:
而不是setInterval(function reload () {
$("#container").load('stats.php');
setTimeout(reload(), interval);
})();