按鈕點擊器的網站

我需要一個按鈕點擊器。當我點擊按鈕，0變爲1，如果我再次點擊，1變爲2等。按鈕點擊器的網站

我試過這段代碼，但它不適用於我。

我需要一個能夠工作的代碼，並且即使我刷新標籤頁或關閉它，也會記住點擊次數。這是我試過的代碼。

<html> 
<head> 
    <title>Space Clicker</title> 
</head> 

<body> 
    <script type="text/javascript"> 
    int clicks = 0; 
    function click() { 
     clicks += 1; 
     document.getElementById("clicks").innerHTML = clicks; 
    }; 
    </script> 
    <button type="button" onClick="click()">Click me</button> 
    <p>Clicks: <a id="clicks">0</a></p> 

</body></html>

來源

2015-05-09 Stefan Đorđević

你看着餅乾？ – Drakes

我看了看餅乾嗎？我想在網站上製作類似Cookie-Clicker的遊戲，所以第一步就是這樣。 :) –

啊，很好，因爲餅乾肯定會「記住點擊量，即使我刷新標籤或關閉[頁面]。」 – Drakes

JavaScript沒有「int」，它使用「var」。

<html> 
<head> 
    <title>Space Clicker</title> 
</head> 

<body> 
    <script type="text/javascript"> 
    var clicks = 0; // change int to var here 
    function countClicks() { 
     clicks += 1; 
     document.getElementById("clicks").innerHTML = clicks; 
    }; 
    </script> 
    <button type="button" onClick="countClicks()">Click me</button> 
    <p>Clicks: <a id="clicks">0</a></p> 

</body></html>

來源

2015-05-09 15:52:00 user3125999

此代碼不工作 –

'click'是一個保留的JS函數 – Drakes

它爲我工作，無論如何，你是絕對正確的。我已經改變了函數的名字... – user3125999

您需要將點擊計數保存到某個地方，並在頁面重新加載時再次檢索。餅乾是很好的地方。

您可以瞭解更多關於cookie here或here

來源

2015-05-09 15:56:34 Orifjon

變化click()幾乎所有的東西但是。我建議incrementClick()。 click()是JavaScript中的保留函數。

<html> 
<head> 
    <title>Space Clicker</title> 
</head> 

<body> 
    <script type="text/javascript"> 
    var clicks = 0; 
    function incrementClick() { 
     clicks += 1; 
     document.getElementById("clicks").innerHTML = clicks; 
    }; 
    </script> 
    <button type="button" onClick="incrementClick()">Click me</button> 
    <p>Clicks: <a id="clicks">0</a></p> 

</body></html>

對於持續整個頁面刷新的點擊，我建議使用cookies來保存點擊變量的當前值，像這樣（ref）：

function createCookie(name, value, days) { 
    var expires; 
    if (days) { 
     var date = new Date(); 
     date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); 
     expires = "; expires=" + date.toGMTString(); 
    } 
    else { 
     expires = ""; 
    } 
    document.cookie = name + "=" + value + expires + "; path=/"; 
}

讀取Cookie：

function getCookie(c_name) { 
    if (document.cookie.length > 0) { 
     c_start = document.cookie.indexOf(c_name + "="); 
     if (c_start != -1) { 
      c_start = c_start + c_name.length + 1; 
      c_end = document.cookie.indexOf(";", c_start); 
      if (c_end == -1) { 
       c_end = document.cookie.length; 
      } 
      return unescape(document.cookie.substring(c_start, c_end)); 
     } 
    } 
    return ""; 
}

支持Cookie的演示：http://jsbin.com/rekafi/4

注意：我建議您不要在您的<button>元素中包含嵌入式JavaScript（例如， onClick="incrementClick()"）。例如，嘗試使用jQuery將JS從HTML中分離出來。

來源

2015-05-09 16:04:12 Drakes

你可以嘗試保存到localStorage的

var clicks = parseInt(localStorage.getItem("clicks") || 0) ; 

function bindThisToButtonClickHandler() { 
    clicks += 1; 
    document.getElementById("clicks").innerHTML = clicks; 
    localStorage.setItem("clicks", clicks) 
};

你可以在這裏檢查瀏覽器支持：http://caniuse.com/#search=localstorage

來源

2015-05-09 16:15:34

HTML代碼，工程

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
    <!--<script src="app1.js"></script> --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/> 

</head> 

<body> 
    <div id="clickdiv" >hello</div> 
    <button onclick="countTracker()">Click me</button> 
    <script type="text/javascript"> 

     var clickCount = 0; 
     function countTracker() { 
      clickCount += 1; 
      document.getElementById("clickdiv").innerHTML = "Clicks:" + clickCount; 
      localStorage.setItem("count", clickCount); 

     } 
     str_count = localStorage.getItem("count"); 
     console.log(str_count); 
    </script> 

</body> 
</html>

來源

2015-05-09 16:18:07

小心解釋一下你有什麼想法把函數名改成'clickFun（）'到OP？ :) – Drakes

@Drakes我急於發佈答案對不起人 –

@Drakes clickFun是一個壞名字，但使用click（）它不工作。我的理解是「點擊」是一個保留字，它不能用作函數名。 –

按鈕點擊器的網站

回答

相關問題