更改输入框的值时如何触发onchange事件？

Question

我正在尝试创建一个简单的JavaScript函数。当某人在字段中插入一个数字时，另一个字段的值应更改为该值。目前我的代码如下：

function updateInput(ish) {  
    fieldname.value = ish;  
}  
<input type="text" name="fieldname" id="fieldname" />  
<input type="text" name="thingy" onchange="updateInput(value)" /> 

这个方法似乎不起作用，有人可以帮我解决一下吗？

- Jay Wit

---

针对那些搜索如何监听输入元素的变化/输入事件的谷歌用户：请查看此答案。链接为https://dev59.com/sGw15IYBdhLWcg3wqNuM#25453163。 - totymedli

Answer 1

您无法将fieldname作为全局变量访问。请使用document.getElementById：

function updateInput(ish){
    document.getElementById("fieldname").value = ish;
}

和

onchange="updateInput(this.value)"

- Alexey Romanov

---

实际上，对于每个具有"id"属性的DOM元素，在全局Window对象中都会创建一个匹配的变量。（在控制台中打开并在此页面上键入“mainbar”）。此外，对于现代浏览器，您可以只输入"value"而无需填写"this"。 - YardenST

我通常为了方便将以下内容添加到我的页面中：function id(id){return document.getElementById(id);} 并像这样使用它：id("whatever").whatever - DividedByZero

Answer 2

对于 jQuery，我们可以使用以下方法：

按输入名称：

$('input[name="textboxname"]').val('some value');

通过输入类：

$('input[type=text].textboxclass').val('some value');

根据输入的id：

$('#textboxid').val('some value');

- Aditya P Bhatt

Answer 3

<input type="text" name="fieldname" id="fieldtobechanged" />  
<input type="text" name="thingy"  id="inputfield" />

我使用了以下代码，它可以立即运行而且没有任何延迟。

var timeoutID = null;
    
function findMember(str) {
    document.getElementById("fieldname").innerHTML = str;
}

$('#inputfield').keyup(function(e){
    clearTimeout(timeoutID);
    timeoutID = setTimeout(findMember.bind(undefined, e.target.value), 500);
});

- Observer