Question

我想在用户键入另一个 input 字段时实时更改 input 字段的值，最好使用常规JS而不是JQuery。

示例：用户在＃input_1 中输入随机值，并且在相同的时间，＃input_2 接收用户输入的内容并将其设置为该值。 / p>

如果用户从＃input_1 值中删除了一个数字，则会跟随＃input_2 并从其值中删除相同的数字。

这一切都是实时的，最好是没有，只需按下按钮即可触发执行此操作的功能。

Answer 1

有很多方法可以实现这一点。这是我的处理方式：

HTML：

<input id="sourceField" />
<input id="destinationField" />

JS：

// When the page is done loading and rendering...
window.addEventListener('DOMContentLoaded', ()=>{
    // Get the appropriate elements
    const sourceField = document.getElementById('sourceField')
    const destinationField = document.getElementById('destinationField')

    // When the user types some input into the first text field...
    sourceField.addEventListener('input', ()=>{
        // Set the value of the destination field to the value of the source field.
        destinationField.value = sourceField.value
    })
})

Answer 2

容易;）

<input id="input1" onkeyup="document.getElementById('input2').value=this.value" />
<input id="input2" />

Answer 3

您可以这样做

您需要选择（在事件上）第一个输入，并从该输入中获取值，并在第二个输入中进行更新。

function handle(e){
  var input1 = document.getElementById('input1').value;
  console.log(input1)
  document.getElementById('input2').value = input1;
}

<input id='input1' onkeyup="handle()" value=""/>
<input id='input2'  value="" />

如何使用JavaScript实时更改<input />字段的VALUE属性？

3 个答案: