如何动态更改Bootstrap切换状态? [英] How can I change the Bootstrap toggle state dynamically?
本文介绍了如何动态更改Bootstrap切换状态?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试动态添加新的自举切换开关,但我不知道如何动态更改状态.提前致谢!
I'm trying to add new bootstrap toggle switch dynamically but I don't know how to change the state dynamically. Thanks in advance!
$('.btn').on('click', function () {
var status = true;
for(var i=0; i<3; i++){
$('p').after(
'<input id="newCheckBox" type="checkbox" data-off-text="Male" data-on-text="Female" checked="false" class="newBSswitch">'
);
console.log(status);
$('.newBSswitch').bootstrapSwitch('state', status);
status = false;
}
});
<p> <a class="btn btn-lg btn-primary" href="#">Display another Toggle</a></p>
这是小提琴: http://jsfiddle.net/icamilo95/8wars2ep/7/
推荐答案
我意识到我只需要在输入中添加不同的ID并为每个特定ID更改类.newBSSwitch即可:
I realized I just had to add different Id's to the inputs and change the class .newBSSwitch for every specific Id like this:
$('.btn').on('click', function () {
var status = true;
for(var i=0; i<5; i++){
$('p').after(
'<input id="newCheckBox'+[i]+'" type="checkbox" data-off-text="Male" data-on-text="Female" checked="false" class="newBSswitch">'
);
console.log(status);
$('#newCheckBox'+[i]).bootstrapSwitch('state', status);
status = false;
}
});
<p> <a class="btn btn-lg btn-primary" href="#">Display another Toggle</a></p>
这篇关于如何动态更改Bootstrap切换状态?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文