Question

我有一个用jquery ui制作的滑块，它工作得很好，除了因为范围是从0到250000，并且因为我每次都有一些变化时我要事件调用ajax请求，如果我从一侧滑到另一个缓慢的结果将是大量的ajax请求，并不是很好。

一直在挖掘jquery ui文档，但没有看到任何方法来解决这个问题。我会在用户按下滑块时暂时阻止该事件，并仅在用户停止与其进行交互时触发事件，但未发现此事。

有什么想法吗？

干杯！

Answer 1

不是订阅滑块的幻灯片事件，为什么不订阅它的slidechange或stoplide事件呢？

$( ".selector" ).slider({
   change: function(event, ui) { ... }  // Called after slidestop or if changed programmatically
   stop: function(event, ui) { ... }    // Called when user stops sliding
});

Answer 2

一种可能性是创建一个计时器并给它一个以毫秒为单位的超时时间，比如500，这是半秒。每次幻灯片事件触发时，计时器都会重置为超时时间。

如果计时器设法完全倒计时，您可以假设用户已停止移动滑块并触发您的Ajax呼叫。

这是TypeWatch之类的JQuery插件用于仅在用户停止在文本框中键入时发送Ajax请求的方法。

Answer 3

    we can define steps in it also like,

    $("#slider-range-max").slider({
            range : "max",
            min : 0,
            max : 200,
            step : 0.1,   //steps
            value : 200,
            slide : function(event, ui) {
                $("#amount").val(ui.value);
            }
        });

Even we can handle it by writing value in textbox like this,

on value change of textbox call this function by passing parameter this.value

function setSlider(value) {
    $("#slider-range-max").slider({
        range : "max",
        min : 0,
        max : 200,
        step : 0.1,
        value : value,  // value will be setted slider position as par value
        slide : function(event, ui) {
            $("#amount").val(ui.value);
        }
    });
    $("#amount").val($("#slider-range-max").slider("value"));
}

jQuery UI滑块 - 大范围

3 个答案: