Question

点击复选框updateText()时，我想调用函数text_mode。我尝试过使用onClick="updateText()"，但它没有用。我已经阅读了类似问题的一些评论，但所有答案都是使用jQuery，我可以不使用任何库来完成，因为这个项目的所有js代码都没有任何库吗？

这是复选框：

<label class="checkbox-inline">
   <input type="checkbox" checked data-toggle="toggle" data-size="mini" data-onstyle="default" id="text_mode" onclick="updateText()">
</label>

Answer 1

使用onchange事件

<label class="checkbox-inline">
    <input type="checkbox" checked ... onchange="updateText()"> Braille
</label>

无论单击复选框，都会执行它。因此，如果您触发标签，它也将被执行。

Answer 2

试试这个：

＆＃13;

document.getElementById('text_mode').addEventListener('click', function(){
	console.log('updateText executed')
});

＆＃13;

<label class="checkbox-inline">
   <input type="checkbox" checked data-toggle="toggle" data-size="mini" data-onstyle="default" id="text_mode"> Braille
</label>

＆＃13;

Answer 3

在版本3.5中，存在相同的问题。向库添加了一个事件调用：

$(document).on('touch.bs.toggle click.bs.toggle', 'div[data-toggle^=toggle]', function (e) {
    var $checkbox = $(this).find('input[type=checkbox]')
    $checkbox.bootstrapToggle('toggle')
    $checkbox.trigger("click")    // <!-- Added line
    e.preventDefault()
})

我的问题解决了。

单击Bootstrap切换时调用函数（复选框）

3 个答案: