如何预先切换Bootstrap的btn-group中的button?

我刚开始使用bootstrap。

你能告诉我如何部署Radion Button组,并使其中一个button预切换。

我有一个无线电button组,有弱点价值的日子。 这个:

<div class="btn-group" data-toggle="buttons-radio"> <button class="btn" id="test0">Mon</button> <button class="btn" id="test1">Tue</button> <button class="btn" id="test2">Wed</button> <button class="btn" id="test3">Thu</button> <button class="btn" id="test4">Fri</button> <button class="btn" id="test5">Sat</button> <button class="btn" id="test6">Sun</button> </div> 

我需要的是获取当前date值(使用var currentDay = new Date().getDay() )并toggle (激活)组中的相应button。

我试图用下一个代码切换它(仅用于testing目的):

 $("#test0").button('toggle') 

不工作。

先谢谢你。

您可以利用bootstraps .btn.active类并将其添加到您希望首先切换的button,并且可以使用jQuerys toggleClass来解除button的locking。 演示 。


只是注意到twitter有一个你可以调用这个效果的button脚本,这里是一个你期望的结果的固定的演示 。


看了你从评论中真正想要的东西之后,我更新了我正在寻找的结果。

我添加了一个函数,它使用来自数组的javascripts getDay方法拖动当前date,并通过定位button的ID来切换button组上的相应date: demo

相关编码:

JS

 function today() { var arr = ["0", "1", "2", "3", "4", "5", "6"]; //first day of the week is sunday and its index is 0 var currentDay = new Date().getDay(); return (arr[currentDay]); } var day = '[id="test' + today() +'"]'; // we take the current day from the array and add the beginning of the class name and save it in a variable $(day).button('toggle'); 

我尝试了以上,但只想要一个HTML / CSS解决scheme。

我发现一个基于焦点的方法将适用于Bootstrap 3.请注意, 自动对焦是一个HTML5属性

 <div class="btn-group"> <button class="btn" id="test0" autofocus="true">Mon</button> <button class="btn" id="test1">Tue</button> <button class="btn" id="test2">Wed</button> <button class="btn" id="test3">Thu</button> <button class="btn" id="test4">Fri</button> <button class="btn" id="test5">Sat</button> <button class="btn" id="test6">Sun</button> </div> 

我发现Bootply比 Bootstrap更容易。
这是我的testingbootply: http : //www.bootply.com/cSntVlPZtU

我遇到了同样的问题,但想要一个更简单的解决scheme。 我注意到,追加“积极”类没有解决问题,因为它被删除某种程度上(我没有研究为什么这样做)。

解决scheme是在课堂上附加“积极主动”。 这样,只有一个被移除,另一个绕过后面发生的魔法。 这是一个非常肮脏的解决scheme,但它解决了这个问题。 希望能帮助到你!

只是模拟点击页面加载button:

$( “#buttonid”)触发( “点击”)。

为我工作的另一个类似的标准button,我想显示为已被点击页面加载 – button操作是必需的,以设置页面默认表格视图我想显示。 其他button提供不同的视图,但默认的显示所有数据。