2012-02-16 125 views
1

我想統計用戶點擊每次鼠標點擊的次數,所以我創建了一個函數,但它只計算第一次點擊。我創建一個變量來存儲計數值。點擊計數功能不起作用?

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

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

+0

現在我明白了,如果我把varibale出來的函數,那麼increaments它的價值。現在我的問題是爲什麼我們需要把這個變量放在函數 – 2012-02-16 03:32:09

回答

2

那是因爲你在函數裏面聲明瞭var clicks。每次調用時它都會被覆蓋0。在函數的範圍之外聲明它。

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

var關鍵字初始化變量。 JavaScript將在更狹窄的函數範圍內使更廣泛的範圍定義可用的變量。因此,在函數外調用var clicks = 0將全局(window對象)範圍的clicks位置。

+0

之外,謝謝邁克爾,我沒有得到它。 – 2012-02-16 03:35:45

3

你需要讓clicks全球,這樣的功能繼續增加相同的變量...

var clicks=0; 
function clickcount(){ 

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

} 
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 
+0

+1,但可能應該使用load事件來附加偵聽器,並檢查document.getElementById(「count」)是否在分配給它的* value *屬性之前返回一個元素。 – RobG 2012-02-16 05:48:06

+0

@RobG感謝您的建議,我添加了onload。 – mc10 2012-02-17 01:16:30