从动态输入元素中获取值

Question

在网页中，我们有一个输入类型文本：

<input id="bar" type="text" />

我想在上面的元素之前插入另一个输入元素：

var input = $('<input type="text" value="foo" id="ciccia" />')
input.insertBefore($('#bar'))

并添加一个简单的行为：

input.on('keyup', function(){
    console.log(input.attr('value'));
})

console.log总是得到“foo”字符串

---

如果我改变

 var input = $('<input type="text" value="foo" id="ciccia" />')

到

 var input = $('<input type="text" value="bar" id="ciccia" />')

console.log总是得到“bar”字符串。

---

DOM有什么问题？为什么我无法读取文本输入的真正价值？

Answer 1

尝试使用.val()来检索文本框值，因为.attr('value')将始终返回在开头设置的值。

input.on('keyup', function(){
    console.log(input.val());
});

或仅使用this.value代替input.val()

Answer 2

attr将始终返回最初设置的值。您需要使用.value属性

使用

input.on('keyup', function(){
    console.log(this.value);
})