点击计数功能不起作用?

时间:2012-02-16 03:25:17

标签: javascript html

我想计算每个鼠标点击用户点击,所以我创建一个功能,但它只计算第一次点击。我创建一个变量来存储计数值。

<!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>

3 个答案:

答案 0 :(得分:3)

你需要使clicks全局化,以便函数继续增加相同的变量......

var clicks=0;
function clickcount (){

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

}

答案 1 :(得分:2)

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

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

var关键字初始化变量。 JavaScript将在更窄的功能范围内在更广泛的范围内定义可用的变量。因此,在函数外部调用var clicks = 0会将clicks放在全局(window对象)范围内。

答案 2 :(得分:1)

为避免污染全局命名空间,您可以将代码包装在匿名函数中,并将点击存储在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