Jquery：如何根据属性值将按键事件绑定到输入类型“数字”[重复]

Posted 2023-03-05

【中文标题】Jquery：如何根据属性值将按键事件绑定到输入类型“数字”[重复]

【英文标题】：Jquery: How to bind keypress event to an input type 'number' based on attribute value [duplicate]

【发布时间】：2017-01-28 07:20:45

【问题描述】：

我只想在输入字段为number 类型且对应属性validate 的值为checkit 时执行验证。我不确定我应该通过什么来代替 astrix 将其绑定到下面代码中提到的按键事件$('*** input[type=number]').bind。我被困在这里，感谢您提供这方面的任何帮助。

<input type="number" validate="checkit">

$('input[type=number]').bind('keypress', function(e) 
    //do things here
);

【问题讨论】：

$('input[type=number][validate="checkit"]').bind('keypress'.....

此解决方案不起作用，因为问题不是选择器，而是您选择元素的时间。您应该使用“on”来列出动态变化的属性。 $('form').on('keypress',''input[type=number][validate="checkit"]'', function(e));

@cezarypiatek 感谢您的 cmets 和 .bind 不适用于与相同选择器匹配的动态添加的元素...elijahmanor.com/… 这里它说“.on 方法带来了很多一致性API 并希望让事情变得不那么混乱。”

【参考方案1】：

试试这个：

$('input[type=number][validate=checkit]').bind('keypress', function(e) 
    //do things here
);

【讨论】：

根据本站elijahmanor.com/… 使用 .on 更好 ....$('input[type=number][validate=checkit]').on('keypress', function(e ) //在这里做事 );

是的，我知道，我复制了你的代码。

【参考方案2】：

您可以在事件处理程序中添加一个条件，这使您的 代码如下：

$('input[type="number"]').bind('keypress', function(e) 
    if($(this).prop('validate') == 'checkit')
    
       // do here
    
);

或者您可以为您的input[type='number'] 分配一个类，例如.input-num，然后像这样创建一个事件侦听器：

 $('.input-num[validate="checkit"]').bind('keypress', function(e) 
        // do things here
    );

第一个解决方案会根据输入的数量（如果输入太多）添加内存开销，因为所有输入都会附加一个事件，但代码会根据我们刚刚添加的条件排除输入.

不过，第二种解决方案在性能和内存方面更好，但它需要您向 input[type="number"] 添加类，这会增加一些时间开销

【讨论】：

我已经更新了答案。