javascript - 当鼠标在元素上时，Javascript在间隔中执行函数

Question

我想实现一个简单的东西（在这里模拟）

[+] 123 [-]

当用户按住鼠标+或-总和增加或减少时。

因此，我编写了一个简单的脚本来执行此操作（http://jsfiddle.net/wFAfy/3/），似乎可行，但我对这种方法的效率/稳健性感到好奇，因为我在前面不是很有经验-结尾。

或者有没有更好的方法来做到这一点（也许使用插件或其他东西）？

HTML：

<p id="sum">0<p>
<a id="inc" href="#">inc on hover</a> | 
<a id="dec" href="#">dec on hover</a>

JavaScript：

sum = $("#sum")
inc = $("#inc")
dec = $("#dec")

currentSum = -> parseInt sum.text()

incSum = -> sum.text currentSum() + 1    
decSum = -> sum.text currentSum() - 1
    
run = (f, direction) ->
  -> 
    return unless running[direction] == true
    f()

running = { inc: false, dec: false }

inc.mouseenter -> running.inc = true
inc.mouseleave -> running.inc = false
dec.mouseenter -> running.dec = true
dec.mouseleave -> running.dec = false

setInterval run(incSum, "inc"), 200
setInterval run(decSum, "dec"), 200

Answer 1

我同意 Ian 的建议 - 这是该实现的示例：

$sum = $ '#sum'
$inc = $ '#inc'
$dec = $ '#dec'

currentSum = 0

incSum = -> $sum.text currentSum++
decSum = -> $sum.text currentSum--

interval = null

$inc.on
  'mouseenter' : ->
    interval = setInterval incSum, 200
    incSum()
  'mouseleave' : -> clearInterval interval

$dec.on
  'mouseenter' : ->
    interval = setInterval decSum, 200
    decSum()
  'mouseleave' : -> clearInterval interval