当字段内容更改时,我试图从我的 html 中删除错误标签。它在 input
和 select
上运行良好,但在 input-group
上运行不佳。我想要一个适用于所有 HTML 实例的命令。
我有一个JSFIDDLE here我的问题。
我的 HTML:
<div class="col-xs-12">
<div class="form-group">
<select class="form-control error-input" id="cc-exp_month" name="cc-exp_month" autocomplete="cc-exp_month" required="">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<label class="error-message">This expiry date is invalid</label>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<input type="text" class="form-control cc-name error-input" placeholder="Card Name" name="cc-name" id="cc-name" autocomplete="cc-name" required="">
<label class="error-message">This card is invalid</label>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<div class="input-group">
<input type="tel" class="form-control cc-cvv error-input" placeholder="•••" maxlength="4" name="cc-cvv" id="cc-cvv" autocomplete="off" required="" data-numeric="">
<span class="input-group-addon">
<a href="#" id="cvv-popover" data-toggle="popover" data-trigger="hover" title="" data-placement="top" data-original-title="CVV">
<i class="icon-help ion-fw"></i>
</a>
</span>
</div>
<label class="error-message">Invalid cvv</label>
</div>
</div>
我的 JS 删除错误类和更改标签:
$('#cc-exp_month').change(function() {
$('#cc-exp_month').removeClass('error-input');
$('#cc-exp_month').parent('.form-group').find('label.error-message').remove();
});
$('#cc-name').change(function() {
$('#cc-name').removeClass('error-input');
$('#cc-name').parent('.form-group').find('label.error-message').remove();
});
$('#cc-cvv').change(function() {
$('#cc-cvv').removeClass('error-input');
$('#cc-cvv').parent('.form-group').next('.error-message').remove();
});
CVV 字段丢失了其类别,但我无法删除下面的错误标签。我希望实现一个可以在两个实例(输入和输入组)上工作的“通用”jquery 链接命令。
谢谢!
最佳答案
<强> Fiddle
$('input').change(function() {
$(this).removeClass('error-input');
$(this).closest('.form-group').find('label.error-message').remove();
});
$('select').change(function() {
$(this).removeClass('error-input');
$(this).closest('.form-group').find('label.error-message').remove();
});
关于javascript - jQuery 从 HTML block 中删除错误标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38116711/