点击计数功能不起作用？

问题描述：

我想统计用户点击每次鼠标点击的次数，所以我创建了一个函数，但它只计算第一次点击。我创建一个变量来存储计数值。点击计数功能不起作用？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>clicks</title> 

<script type="text/javascript"> 



function clickcount(){ 

var clicks=0; 
    document.getElementById('count').value= ++clicks; 


    } 

document.onclick=clickcount; 
</script> 


</head> 

<body> 

<input type="text" id="count" /> 
</body> 
</html>

http://jsfiddle.net/vuASn/ – xandercoded 2012-02-16 03:29:19

现在我明白了，如果我把varibale出来的函数，那么increaments它的价值。现在我的问题是为什么我们需要把这个变量放在函数 – 2012-02-16 03:32:09

答

那是因为你在函数里面声明了var clicks。每次调用时它都会被覆盖0。在函数的范围之外声明它。

var clicks = 0; 
function clickcount(){ 
    document.getElementById('count').value= ++clicks; 
}

var关键字初始化变量。 JavaScript将在更狭窄的函数范围内使更广泛的范围定义可用的变量。因此，在函数外调用var clicks = 0将全局（window对象）范围的clicks位置。

之外，谢谢迈克尔，我没有得到它。 – 2012-02-16 03:35:45

答

你需要让clicks全球，这样的功能继续增加相同的变量...

var clicks=0; 
function clickcount(){ 

    document.getElementById('count').value= ++clicks; 

}

答

为了避免污染全局命名空间，你可以换你的代码在一个匿名函数和存储您的点击在closure：

(function() { // Begin wrap with anonymous function 
    var clicks = 0; 
    function clickcount() { 
     document.getElementById("count").value = ++clicks; 
    } 

    // Attach to onload 
    window.onload = function() { 
     document.onclick = clickcount; 
    }; 
}()); // End wrap with anonymous function

+1，但可能应该使用load事件来附加侦听器，并检查document.getElementById（“count”）是否在分配给它的* value *属性之前返回一个元素。 – RobG 2012-02-16 05:48:06

@RobG感谢您的建议，我添加了onload。 – mc10 2012-02-17 01:16:30

点击计数功能不起作用？

相关推荐