我正在使用Ruby on Rails和Simple Form Gem的Bootstrap Switch Gem。 根据Bootstrap Switch指令,我按如下方式初始化了交换机:
$(document).ready(function() {
$("[input='radio']").bootstrapSwitch();
});
但是,单选按钮显示为两个开关且无法正常工作:
然而,他们应该显示如下:
这会导致什么?我正在使用它作为一个复选框,所有工作都按预期工作。
单选按钮的HTML输出:
<span class="radio">
<label for="client_high_profile_true">
<div class="bootstrap-switch bootstrap-switch-wrapper bootstrap-switch-inverse bootstrap-switch-id-client_high_profile_true bootstrap-switch-on bootstrap-switch-animate" style="width: 106px;">
<div class="bootstrap-switch-container" style="width: 156px; margin-left: -52px;"><span class="bootstrap-switch-handle-off bootstrap-switch-default" style="width: 52px;">NO</span>
<span class="bootstrap-switch-label" style="width: 52px;"> </span><span class="bootstrap-switch-handle-on bootstrap-switch-success" style="width: 52px;">YES</span>
<input class="radio_buttons optional" type="radio" value="true" name="client[high_profile]" id="client_high_profile_true">
</div>
</div>Yes
</label>
</span>
<span class="radio">
<label for="client_high_profile_false">
<div class="bootstrap-switch bootstrap-switch-wrapper bootstrap-switch-readonly bootstrap-switch-inverse bootstrap-switch-id-client_high_profile_false bootstrap-switch-animate bootstrap-switch-off" style="width: 106px;">
<div class="bootstrap-switch-container" style="width: 156px; margin-left: 0px;"><span class="bootstrap-switch-handle-off bootstrap-switch-default" style="width: 52px;">NO</span><span class="bootstrap-switch-label" style="width: 52px;"> </span>
<span class="bootstrap-switch-handle-on bootstrap-switch-success" style="width: 52px;">YES</span>
<input class="radio_buttons optional" readonly="readonly" type="radio" value="false" checked="checked" name="client[high_profile]" id="client_high_profile_false">
</div>
</div>No</label>
</span>
感谢任何帮助。