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出現在你不需要的時候。