Javascript 开/关:开关按钮引导程序
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14973093/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
On/Off: switch button bootstrap
提问by Manoz
Here is my code-
这是我的代码-
<div id="normal-toggle-button" class="toggle-button" style="width: 100px; height: 25px;">
<div style="left: 0px; width: 150px;"><input type="checkbox" checked="checked"><span class="labelLeft" style="width: 50px; height: 25px; line-height: 25px;">ON</span><label for="" style="width: 50px; height: 25px;"></label><span class="labelRight" style="width: 50px; height: 25px; line-height: 25px;">OFF </span></div>
</div>
</div>
Script-
脚本-
$(document).ready(function() {
$('#normal-toggle-button').toggleButtons();
});
I want a basic button given on this page- Switch buttons
我想要这个页面上给出的基本按钮 -切换按钮
I am doing all right. But something i still missed.
我做得很好。但我仍然错过了一些东西。
Check in here- Fiddle
在这里签到- 小提琴
回答by Steely Wing
回答by Amir T
class matters
阶级问题
You had the class as "toggle-button" still, change it to "switch"
您仍然将课程设置为“切换按钮”,请将其更改为“切换”
Here is your updated fiddle: http://jsfiddle.net/WvRZw/10/
这是您更新的小提琴:http: //jsfiddle.net/WvRZw/10/
<div id="normal-toggle-button" class="toggle-button"....
change to
改成
<div id="normal-toggle-button" class="switch" ....
css/javascript includes
css/javascript 包括
You need to include the bootstrap javascript and css as well (see the resources section) (also regarding including javascript and css: How to get bootstrap buttons to show active state?)
您还需要包含引导程序 javascript 和 css(请参阅资源部分)(还关于包含 javascript 和 css:如何获取引导程序按钮以显示活动状态?)

