javascript - 如何使一个 Jquery 脚本适用于名称略有不同的多个输入

Question

我有一个 jquery keyup 脚本，它在 text input 值更改时更改 checkbox input 的数据属性。目前它仅适用于 checkbox input 和 text input 的一个实例。但是，我需要修改脚本以适用于 10 个实例。

在此fiddle你可以看到我让它对第一个实例编号 1 起作用，但对 2-10 不起作用。

因此，例如，当用户使用 id="account_balance1" 更改输入值时会触发脚本，如下所示。

<input type="checkbox" checked="checked" data-cost="100" debt="" value="" name="f_2[]"/>

这是为 keyup 事件输入值的输入

<input type="text" maxlength="7" class="balance" id="account_balance1" name="cardbalance" value=""/>

但我需要它为这两个输入的 10 个实例工作；对于每个实例，都有一个 li id=card_"和 input id="account_balance_" 增加 1 个增量，就像这样... li id="card_1" 到 li id="card_2" 到 li id="card_3" 等等。这对于 input id="account_balance_1 是一样的，它去到 _2 到 _3 等等。

这是键盘脚本

$(function () {
    $('#account_balance1').on('keyup blur paste', function() {
        var self = this;
        setTimeout(function() {
            var str = $(self).val();
            $("input[data-cost][debt]").data('cost',str.replace(/^\$/, ''));
            $("input[data-cost][debt]").data('debt',str.replace(/^\$/, ''));
            $('#jquery-order-form').data('jprice').onChange();
        }, 0)
    })     
});

Answer 1

只需更改您的 jquery 选择器:

代替这个:

$('#account_balance_1').on('keyup blur paste', function() {

这样做:

$('.balance').on('keyup blur paste', function() {

这是有效的，因为你所有涉及的输入都有 balance 类。

在这里 fiddle :http://jsfiddle.net/edgarinvillegas/8jdfJ/10/

干杯