Javascript 使用bootstraptogle动态更改切换

我正在使用这个插件的切换

我希望使用数据库中的数据动态更改该值

这是我的开关

<input id="switchOutput2_AA" name="switchOutput2_AA" <?php echo ($output2 == 2 ? 'checked' : '')?> type="checkbox" data-toggle="toggle" data-on="<?php echo _("ON") ?>" data-off="<?php echo _("OFF")?>" data-onstyle="success" data-offstyle="danger" value="1">    

并尝试：

$( '#switchOutput2_AA').prop('checked', true);

有什么想法吗？Thx.

打开

$('#switchOutput2_AA').removeClass('off')

关闭

$('#switchOutput2_AA').addClass('off')

---

我找到了答案。我们必须更改输入的父div上的类。这个父项是由bootstraptoggle插件创建的，所以您的代码中没有它

我的代码是

<input id="switchOutput2_AA" name="switchOutput2_AA" checked type="checkbox" data-toggle="toggle" data-on="ON" data-off="OFF" data-onstyle="success" data-offstyle="danger" value="1">    

和切换至关闭：

$( '#switchOutput1_AA' ).parent().addClass('off');
$( '#switchOutput1_AA' ).parent().removeClass('btn-success');
$( '#switchOutput1_AA' ).parent().addClass('btn-danger');

和我一样，在事件调用结束时更改（）

$('#switchOutput2_AA').prop('checked', !$('#switchOutput2_AA').prop('checked')).change();

或者更容易理解

var currentValue = $('#switchOutput2_AA').prop('checked');

$('#switchOutput2_AA').prop('checked', !currentValue).change();

---

只需添加这一行即可打开切换

---

$（'.your_class_name'）.bootstrapToggle（'on'）

好的，我找到了。我必须添加/删除父div上的类“off”。此外，我还需要更改父div上的“btn success”或“btn danger”。

$( '#switchOutput1_AA' ).parent().addClass('off');
$( '#switchOutput1_AA' ).parent().removeClass('btn-success');
$( '#switchOutput1_AA' ).parent().addClass('btn-danger');

$('#switchOutput2_AA').prop('checked', !$('#switchOutput2_AA').prop('checked')).change();

var currentValue = $('#switchOutput2_AA').prop('checked');

$('#switchOutput2_AA').prop('checked', !currentValue).change();