css - 如何创建自举开关

Question

我的一位网页设计师给出了制作bootstrap switch的模板。我编译了它并在页面顶部呈现。它显示了checkbox。

模板代码:

 <script id="switchTemp" type="text/x-handlebars-template">
    <div class="span16 mr1 headerToggleDiv" style="height:42px;">
    <div class="switch switch-square pull-right" data-off-label="1" data-on-label="2"><input type="checkbox" id="switchBox"/></div>
    </div> 
</script>

使用 this ，我尝试了以下方式。

  $('#switchBox').wrap('<div class="switch switch-square pull-right has-switch" />').parent().bootstrapSwitch();

使用默认名称(开、关)变小，如下所示。

我想用下面的方式。

我想要 1,2 而不是 on,off 作为标签。

谁能帮帮我

谢谢

Answer 1

请删除脚本标签并使用下面的代码获取 1 和 2 用于 On 和 Off。

 <div class="make-switch pull-right" data-on-label="1" data-off-label="2">
    <input type="checkbox" id="switchBox"/>
 </div>