用JS键盘将数字插入输入字段,而不删除以前输入的数字

时间:2018-10-10 12:33:15

标签: javascript

在我正在从事的项目中寻求帮助,伙计们和女孩。

我有一个简单的键盘,数字从0到9,每个数字都是一个单独的元素。

我的目标是在所有元素上绑定onclick()事件,并使它们将各自的数字插入我选择的输入字段中。

我知道如何设置某个元素的值(在本例中为输入字段),但是我不知道如何保留先前输入的数字而不用下一个单击的数字重写整个字段的值键盘。

document.getElementById("field").value = "digit-here"

这就是我设置整个值字段的方式。如何插入数字而不删除先前输入的数字?

3 个答案:

答案 0 :(得分:1)

您可以执行以下操作:

document.getElementById("field").value += "digit-here"

基本上只需在等号(=)之前添加 +

答案 1 :(得分:1)

获取现有值,将数字添加到末尾,设置该值。 +=很高兴通过value为您做到这一点:

function handler(e) {
  document.getElementById("field").value += this.value;
}

for (let n = 1; n < 10; ++n) {
  const btn = document.createElement("input");
  btn.type = "button";
  btn.value = n;
  btn.addEventListener("click", handler);
  document.body.appendChild(btn);
}
<input type="text" id="field">
<br>

在文本字段具有焦点的情况下执行此操作可能会出现问题,因为插入点将移动,但是由于单击按钮仍然会使文本字段失去焦点,因此在这种简单情况下这不是问题。

答案 2 :(得分:0)

按照@ T.J Crowder所说的方法尝试

var text = document.getElementById("field").value = "";

text.value += '';