复选框即使设置为无显示也显示

Question

我正在使用Checkbox toggle plugin在复选框中显示切换效果。Checkbox的关注点与togglebutton一起显示。

Jquery复选框显示

有趣的是，在调试html部分时，我发现输入样式复选框设置为display:none。

调用Jquery插件

 @Html.CheckBoxFor(m => m.Gender, new {@class="chkbxSwitch", @id = "chkbxGender" })
 $("#chkbxGender").checkboxpicker({
    offClass: 'btn-primary',
    onClass: 'btn-primary',
    offLabel:'MALE',   
    onLabel: 'FEMALE'

});

呈现HTML输出

<input class="chkbxSwitch" data-val="true" data-val-required="The Gender field is required." 
id="chkbxGender" name="Gender" type="checkbox" value="true" style="display: none;">
         <div class="btn-group" tabindex="0">
             <a class="btn active btn-primary">MALE</a>
             <a class="btn btn-default">FEMALE</a>
         </div>
         <input name="Gender" type="hidden" value="false">

Answer 1

我通过定义下面提到的css解决了上述情况

    #chkbxGender
    {
        display:none !important
    }