在具有相同类的多个输入文本上触发 keyup 事件

路易吉诺

我有这样的风景:

<input type="text" id="quantity_2" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_17" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_16" maxlength="99" class="qty_item" value="0">

我正在尝试触发一个显示警报的 keyup 事件:

$(function() {

    $('input:text.qty_item').on('keyup', function() {
        alert("clicking quantity field!....");
    });

});

但它不显示任何警报......这不应该识别它从哪里按下一个键并触发警报或在所有输入上具有相同的类名会使jquery混淆识别它被按下键的元素吗?

在此先感谢大家!干杯! :-)

曲折

考虑以下代码。

$(function() {
  $("input[type='text'].qty_item").keyup(function() {
    console.log("Key Up - " + $(this).attr("id"));
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="quantity_2" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_17" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_16" maxlength="99" class="qty_item" value="0">

这按预期工作。您可能要考虑不使用伪选择器,例如:text.

如果需要使用Delegate赋值,对于动态创建的item,选择最近的静态父元素。

$(function() {
  $(document).on("keyup", "input[type='text'].qty_item", function() {
    console.log("Key Up - " + $(this).attr("id"));
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="quantity_2" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_17" maxlength="99" class="qty_item" value="0">
<input type="text" id="quantity_16" maxlength="99" class="qty_item" value="0">

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章