Javascript定时器作为缓冲区

我有一个滑块，它使用以下代码行将其值发送到web服务器：

window.location = "http://172.20.2.1:83/trigger/1?" + value;

这段代码在我的TestSlider（value）函数中，该函数是从一个范围的onchange事件调用的

问题是，当我移动滑块时，我会向web服务器发送大量数据

我想创建一个缓冲区来发送最近的值。我已经创建了一个计时器功能，目前我很高兴它每秒滴答一次。它应该获取公共变量值，并暂时将其写入日志

然而，我看到的问题是，它仍在向日志中写入大量数据，因此它当然会使我的web服务器崩溃

以下是我的javascript：

    //Put a timer in to work as buffer. This should stop the lpc crashing. I think its 
    //as a result of to much data. 
    var c=0;
    var t;
    var timer_is_on=0;


    // Holy Smoke Hacked...liked a pro! 
    calculateHost();
    var ip = getControllerIP();
    var triggerNumber = 1;
    var Value;




    function timedCount()
    {


        //console.log("Timer Ticked: " + c + "URL : " + url); //Write tick value and url to log.
        c=c+1; //Add 1 to tick value.
        t=setInterval("timedCount()",10000); //Set the old interval. 

        console.log(c);

    }

    function doTimer()
    {

          timer_is_on=1;
          timedCount();


    }   


    function testSlider(value)
    {

        var url = (ip + "/trigger/" + triggerNumber + "?" + value);

        //Removed because its it would be better to see when the timer is executing. 
        //console.log(url);

        Value = value;


        //Removed because we need a buffer. 
        //window.location = "http://172.20.2.1:83/trigger/1?" + value;

    }

---

我认为更好的方法是使用

onMouseUp

事件-这将仅在释放滑块时向服务器发送数据，从而只发送一个请求。

计时器的问题是，您正在启动计时器事件处理程序中的另一个计时器。在第一轮之后，你有两个计时器，然后是四、八、16、32、64、128、256、512等等。。。不久之后，您将拥有比浏览器所需时间更多的计时器，所有计时器都将数据发送到服务器（如果您已经实现了这一点）。

解决方案称为去抖动

我们的想法是只对一系列重复事件中的最后一个做出反应

请在此处阅读所有关于解除抖动事件的信息：

另一种解决方案是限制事件，因此仅在每个设定的时间间隔对事件作出反应

您可以使用以下函数原型扩展来限制事件处理程序，在上面的链接中查找去抖动逻辑：

Function.prototype.throttle = function throttle(delay) {
    var func = this, timeOfLastExec = 0, execWaiting = false;

    return function throttled() {
        var context = this, args = arguments, timeSinceLastExec = new Date().getTime() - timeOfLastExec;

        function exec() {
            execWaiting && clearTimeout(execWaiting);
            execWaiting = false;
            timeOfLastExec = new Date().getTime();
            func.apply(context, args);
        }

        if (timeSinceLastExec >= delay) {
            exec();
        }
        else if (!execWaiting) {
            execWaiting = setTimeout(exec, delay - timeSinceLastExec);
        }
    };
};

---

我需要在滑块移动时获取值。它会触发一些灯光的强度，因此让它调用onMouseUp功能意味着灯光会闪烁或熄灭。啊，好吧，我的坏消息。在这种情况下，可以设置一个

setInterval（）

，每隔100ms左右捕获滑块的值？为什么不等到滑动完成后再发送最终值？或者每x秒只发送一个值。要避免扩展本机原型。为此，我将使用第三方库模拟

节流

，例如下划线。我没有使用您的代码，但现在使用了节流。这与一个非常简单的if语句一起检查值是否随着流量的减少而改变。谢谢。@Raynos:这么简单的东西你会用图书馆吗？你应该学会扩展原型，你的生活会更好；）@MartinJespersen不扩展本地原型。你破坏了对本机对象做出假设的代码。@Raynos：是的，人们就是这么说的。我还没有任何破损发生在10年的使用扩展然而，所以请原谅我没有认真对待它。