javascript - 从 .focusout() 的输入中检索 .val()

Question

我有一系列具有相同类的动态生成的输入，例如:

<input class="addressitem" type="text"/>
<input class="addressitem" type="text"/>
<input class="addressitem" type="text"/>

用户将数据输入到每个字段后，我想获取该数据并将其放置在隐藏输入的值字段中。

但是，我无法找出执行此操作的最佳方法。到目前为止我已经尝试过:

$(".addressitem").focusout(function() {
    var addressinput = $(this).val();
    console.log(addressinput);
});

和

$(".addressitem").change(function() {
    var addressinput = $(this).val();
    console.log(addressinput);
});

但是我无法让任何内容出现在控制台中。

有人能给我指出正确的方向吗？

Answer 1

只要您在 document.ready 事件中定义它们，并且页面中没有任何其他脚本错误，这两种方法都应该有效。

$(function(){

   $(".addressitem").change(function() {
    var addressinput = $(this).val();
    console.log(addressinput);
   });

   $(".addressitem").focusout(function() {
    var addressinput = $(this).val();
    console.log(addressinput);
   });

});

您可以使用浏览器控制台来验证页面中是否存在其他脚本错误。

还请记住，当焦点离开时，change 事件会发生在文本输入字段上。因此，当用户从文本框中更改焦点时，您将看到 console.log。如果您想要即时更新，您应该考虑使用 keyUp 事件

Here是一个工作示例。

<小时/>

编辑:根据评论:我有由 Jquery 点击函数生成的字段。我必须在点击函数中移动我的代码才能使其正常工作。

不，你不需要。您可以简单地使用 jQuery on 委托(delegate)方法。当您使用 jQuery on 注册事件处理程序时，它将适用于 DOM 中当前和 future 的元素(动态注入(inject))。

所以你的代码将是

$(function(){

   $(document).on("change",".addressitem",function() {
     var addressinput = $(this).val();
     console.log(addressinput);
   });     

});