Bootstrap验证：2个glyphicons重叠

Question

我有验证2个字段是国家代码和实际的手机号码。我附上了截图。当给出正确的国家代码并且当时给出无效的移动号码时，用于国家代码和交叉字形的正确的嘀嗒字符相互重叠。我需要通过使用css或js删除国家代码的glyphicon。任何帮助将不胜感激。

Answer 1

我找到了答案。我通过使用jQuery来完成它。

我的实际HTML是如下，

<div class="input-group"> 
    <div class="input-group-addon">+</div> 
    <input type="tel" maxlength="3" class="form-control pull-left" id="CountryCode" name="CountryCode" placeholder="Code"> 
    <input data-bv-field="Mobile" type="text" id="Mobile" name="Mobile" class="form-control"> 
</div> 

引导正确和错误的，因为下面的HTML下面创建glyphicons，以下

<i class="form-control-feedback bv-no-label bv-icon-input-group glyphicon glyphicon-ok" data-bv-icon-for="CountryCode" style=""></i> 
<i class="form-control-feedback bv-no-label bv-icon-input-group glyphicon glyphicon-ok" data-bv-icon-for="Mobile" style=""></i> 

所以我加入了一行代码以删除正确的，国家代码字段的错误字形，

$("#CountryCode").parent().next().removeClass('glyphicon-ok glyphicon-remove'); 

Answer 2

如果你正在使用jQuery：

假设你有

<div class="container"> 
    <div class="form"> 
    form content... 
    </div> 
</div> 

你会打电话：

$('.container form .glyphicon').each(function(i){ // your target input id or class should be placed between 'form' and '.glyphicon' eg: $('.container form input[name=state_code] .glyphicon') 
    if (i!=0) $(this).remove(); 
}); 

这样你摆脱额外的Xes出现在你不需要的时候。