Javascript将数字添加到带有按钮的文本框[重复]

Posted 2023-02-22

【中文标题】Javascript将数字添加到带有按钮的文本框[重复]

【英文标题】：Javascript adding a number to a textbox with a button [duplicate]

【发布时间】：2018-06-05 03:22:14

【问题描述】：

也许是一个愚蠢的问题，但我正在尝试获取文本框中的一个数字并通过按一个按钮将其加 1。

这里是html

<input type="text" id="txt_invoer" value="1">
<button onclick="countUp()">+</button>
<button onclick="countDown()">-</button>

这里是javascript

<script>
    function countUp() 
        var i = parseInt(document.getElementById('txt_invoer').value);
        var iResult = i++;
        document.getElementById('txt_invoer').innerHTML = 
        iResult.toString();
    
</script>

希望我不要太笨... 提前致谢

【问题讨论】：

使用.value = iResult

从 var iResult = i++; 更改为 var iResult= ++i;

【参考方案1】：

在做 i++ 时；赋值是在增量之前完成的。所以这就是为什么很多人都在使用++i。增量后完成分配的位置。

我建议你解决方案：

++i; i += 1; // i = i + 1 的短方法；

我主要推荐第二个。很多人不知道这一点，所以我不鼓励使用 ++ 来消除任何错误风险。

在这里查看有关 ++ 的 Mozilla 文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment_()

【讨论】：

1+，airbnb 的 javascirpt 指南也鼓励您所说的：github.com/airbnb/…

是的，我没有包括它，但你是真的。许多大公司都鼓励这样做。

【参考方案2】：

欢迎来到***好友！

只需使用 DOM 元素的 .value 字段来更新输入的值。 innerHTML 可用于更新 div 的内容等。

同样i++ 会增加值，但会在增加之前返回i 的值，因此您应该使用++i 来返回增加后的值。

function countUp() 
    var txtInvoer = document.getElementById('txt_invoer');
    var i = parseInt(txtInvoer.value, 10);
    txtInvoer.value = ++i;

<input type="text" id="txt_invoer" value="1">
<button onclick="countUp()">+</button>
<button onclick="countDown()">-</button>

【讨论】：

请选择关闭此类问题而不是回答。回答欺骗是一种不好的做法

非常感谢您的工作！ :-)

所以请将其标记为已解决