如何让我的 JavaScript 计数器显示？

Question

我有一个完美的 JavaScript 计数器。 唯一的问题是，直到首先单击按钮后，实际信息才会显示。 但是我希望计数器和其他文本在单击按钮时不断显示和更新。

我在这里缺少什么？

JavaScript：

<script>
function clickCounter() {
    if(typeof(Storage) !== "undefined") {
        if (localStorage.clickcount) {
            localStorage.clickcount = Number(localStorage.clickcount)+1;
        } else {
            localStorage.clickcount = 1;
        }
        document.getElementById("result").innerHTML = "" + localStorage.clickcount + " <br>Subscribers So Far! And...<br>" + (1500 - +localStorage.clickcount) + "<br>Subscribers To Go" ;
    } else {
        document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage...";
    }
}
</script>

HTML：

<p><button onclick="clickCounter()" id="paypal-btn1" type="button">Click me!</button></p>
<p><button onclick="clickCounter()" id="paypal-btn2" type="button">Click me!</button></p>
<p><button onclick="clickCounter()" id="paypal-btn3" type="button">Click me!</button></p>
<div id="result"></div>

Answer 1

看看这个。 创建另一个函数来显示信息，然后在页面加载时调用它。 然后当单击按钮时计数器增加时再次调用此函数。

<script>
    displayInformation(); 
    function displayInformation() {
            document.getElementById("result").innerHTML = "" + localStorage.clickcount + " <br>Subscribers So Far! And...<br>" + (1500 - +localStorage.clickcount) + "<br>Subscribers To Go" ;
    }
    function clickCounter() {
        if(typeof(Storage) !== "undefined") {
            if (localStorage.clickcount) {
                localStorage.clickcount = Number(localStorage.clickcount)+1;
            } else {
                localStorage.clickcount = 1;
            }
        displayInformation();/*Call this to refresh the click information*/
        } else {
            document.getElementById("result").innerHTML = "Sorry, your browser does not support web storage...";
        }
    }
</script>

看这里jsfiddle

Answer 2

在您的函数下添加 clickCounter() 以便它将在加载时执行。