【问题标题】:Count the number of mouse clicks in one second计算一秒内鼠标点击的次数
【发布时间】:2013-08-10 06:02:23
【问题描述】:

您好,我正在开发一个我想提高性能的应用程序。(我知道这个问题有点冗长 - 我很抱歉。)

我将详细解释它是一个仅使用 qtscript/qscript(kinda javascript) 而没有 html 的投标应用程序。

当用户单击按钮时,我想指向一个文本字段(对于普通用户来说,它可以像每秒 -1 或 2 次点击一样)。但是用户疯狂地点击按钮(每秒 5 -10 次点击 - 是的,有些人会这样点击),它会降低性能,比如显示延迟量,因为每次点击都指向文本字段。

我正在考虑一些解决方法,比如如果用户在 1 秒内点击超过 3 次,我们仅在最后一次点击后才调用焦点功能 - 如果你们知道更好的话,我不知道这是一个正确的解决方案请建议。另一个问题是我不能使用 setInterval() 和 clearInterval()。

任何帮助将不胜感激。

【问题讨论】:

  • 使用数组计算每个索引代表100ms的点击次数(使用超时更改当前索引,mod数组长度),只要你愿意(至少一秒),对其进行平均。
  • 第一次点击后可以暂时禁用按钮吗?
  • @PaulS。谢谢..我会试试的。对不起,杰夫曼,它是一个竞标应用程序,所以一秒钟的时间非常重要(客户会抱怨只损失了 1 美元)。

标签: javascript qt qtscript


【解决方案1】:

我会看看Underscore.js_.throttle 函数。

_.throttle = function(func, wait, options) {
  var context, args, result;
  var timeout = null;
  var previous = 0;
  options || (options = {});
  var later = function() {
    previous = options.leading === false ? 0 : new Date;
    timeout = null;
    result = func.apply(context, args);
  };
  return function() {
    var now = new Date;
    if (!previous && options.leading === false) previous = now;
    var remaining = wait - (now - previous);
    context = this;
    args = arguments;
    if (remaining <= 0) {
      clearTimeout(timeout);
      timeout = null;
      previous = now;
      result = func.apply(context, args);
    } else if (!timeout && options.trailing !== false) {
      timeout = setTimeout(later, remaining);
    }
    return result;
  };
};

它看起来很复杂,但一个基本的例子是:

var func = function(){alert("Only do this once every second");},
    throttled = _.throttle(func, 1000);

// Call func() three times in under a second, and
// you get 3 message boxes
func(); // alerts
func(); // alerts
func(); // alerts

// Call throttled() three times in under a second, and
// you only get a message box the first time
func(); // alerts
throttled(); // does nothing
throttled(); // does nothing

// ... wait >1 second ...
func(); // alerts
throttled(); // does nothing
throttled(); // does nothing

【讨论】:

    【解决方案2】:

    example.xhtml - 正文中没有框架,没有脚本元素,并且计算左右点击次数。

    此外,您可以在匿名onclick 事件函数的末尾添加e.preventDefault();。请记住,如果您试图保护内容,那么您最终将失败,任何足够聪明的人意识到如果它已经在他们的计算机(内存、缓存等)上,他们已经拥有它。如果您想保护图像,您必须使用水印。

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <title>Click Counter</title>
    
    <script type="application/javascript">
    //<![CDATA[
    var click_left = 0;
    var click_right = 0;
    
    window.onclick = function(e)
    {
     if (e.which==1) {click_left++;}
     else if (e.which==3) {click_right++;}
    
     alert('Left clicks: '+click_left+'\n\nRight Clicks: '+click_right);
    }
    //]]>
    </script>
    </head>
    
    <body>
    
    <div><p>Left or right click</p></div>
    
    </body>
    </html>
    

    【讨论】:

    • 感谢 John,非常感谢您的帮助,不幸的是我没有在我的应用程序中使用 HTML,它不支持本机 JavaScript 函数,如警报、window.onclick 事件等。感谢您的宝贵时间。
    【解决方案3】:

    首先,您应该检查用户单击某个按钮后要选择的文本编辑是否已经具有焦点。这将大大减少事件队列的负载。

    其次,您可以实现自己的按钮(通过子类化)并使用选项,例如忽略在特定(小)间隔内出现的点击。如果用户开始非常快速地产生点击,您还可以以某种方式在按钮上“可视化”它,向用户显示您的应用程序对用户输入的反应有限,并在指定超时后将其关闭。

    【讨论】:

      猜你喜欢
      • 2014-09-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-06-09
      • 1970-01-01
      • 1970-01-01
      • 2017-05-30
      • 2023-04-10
      相关资源
      最近更新 更多