jQuery在设置为显示无的元素上添加属性

Question

我需要在隐藏元素上添加以下属性：

$("#payWithNewCard select").attr('data-abide-validator', 'checkexpiry');

问题是我的选择被设置为显示无，因为我正在使用插件对其进行自定义。

以下内容当前不起作用。

    $('#paymentMethodNewCard').on('click', function(){
        $("#payWithNewCard select").attr('data-abide-validator', 'checkexpiry');
    });

HTML:

            <div class="small-4 columns expiryDateWrapper">
                <label>{{ 'EXPIRYDATE'|trans }} *</label>
                <select class="sel-box month" name="ccExpirationMonth" data-abide-validator="checkExpiry">
                    <option value="">MM</option>
                    {% for month in 1..12 %}
                        <option value="{{ "%02d"|format(month) }}">{{ "%02d"|format(month) }}</option>
                    {% endfor %}
                </select>
                <select class="sel-box year" name="ccExpirationYear" data-abide-validator="checkExpiry">
                    <option value="">YYYY</option>
                    {% set thisYear = date()|date("Y") %}
                    {% for year in thisYear..thisYear+Booking.CREDIT_CARD_EXPIRES_YEARS_AHEAD %}
                        <option value="{{ year }}">{{ year }}</option>
                    {% endfor %}
                </select>
            </div>

类"sel-box“触发插件隐藏本地select，并使用span元素重新创建自定义select，这就是select被隐藏的原因。但是，为了让FOundation遵守起作用，我需要在实际的select中指定上面指定的数据属性。

Answer 1

而不是单击write change event并在change event函数中使用$(this)。

$('#paymentMethodNewCard').on('change', function(){
    $(this).attr('data-abide-validator', 'checkexpiry');
});