javascript - 需要帮助使用增量并在文本框中显示

Question

我们需要一个文本框，您可以在其中输入一个数字，点击一个按钮，它会以 1 递增，同时保持在同一个文本框中。这是我到目前为止的代码:

<form action=#>
    <p>
        Current Count...<input type="text" id="txtCounter" value="0">
    </p>
    <p>
        <input type="button" value="Increment Count" id="btnIncrement" onclick="btnIncrement_onclick()">
        <input type="reset">
    </p>
</form>
<noscript>This website requires JavaScript to be enabled.</noscript>

JavaScript:

function btnIncrement_onclick() {
    // get textbox and assign to a variable
    var countTextbox = document.getElementById("txtCounter");
    var txtCounterData = txtCounter.value;
    var countTextbox.value = 0++;
}

如果有人可以向我解释如何去做，而不仅仅是给我答案。我不知道为什么我会遇到这样的困难。

Answer 1

尝试下面的简单代码:

function btnIncrement_onclick()
{
    //asign the textbox to variable
    var textbox = document.getElementById("txtCounter");

    //Get the value of textbox and add 1 then update the textbox
    textbox.value = parseInt(textbox.value)+1;
}

<form action=#>
    <p>
        Current Count...<input type="text" id="txtCounter" value="0">
    </p>
    <p>
        <input type="button" value="Increment Count" id="btnIncrement" onclick="btnIncrement_onclick()">
        <input type="reset">
    </p>
</form>
<noscript>This website requires JavaScript to be enabled.</noscript>

希望这对您有所帮助。