javascript - BootstrapToggle 复选框在单击事件时调用函数

Question

我正在尝试将一些事件附加到新的 BootstrapToogle 复选框 http://www.bootstraptoggle.com/但我不知道我失败的地方。

所以基本上我有一个引导切换，我想根据检查的属性(true 或 false)调用一些函数:

<input type="checkbox" id="editor_draw_erase" data-toggle="toggle" data-on="Draw" data-off="Erase" data-onstyle="success" data-offstyle="danger">

$(function(){
    $("#editor_draw_erase").click(function() {
    var Toggle = document.getElementById('editor_draw_erase');
      if (Toggle.checked) {
        console.log("draw")
          //call some function
      } else {
        console.log("erase")
          //call some other functions
      }
    });

})

fiddle :https://jsfiddle.net/c7p9n62w/12/

知道我做错了什么吗？

Answer 1

我遇到了同样的问题。这是因为库创建了自己的元素，而您的复选框并没有真正改变。

你可以看看你的复选框是否有 off 类。

您可以在选中复选框时通过检查 DOM 来检查这一点。

$(".toggle").click(function() {
  if($(this).hasClass("off")){
     console.log("draw")
  } 
  else{
     console.log("erase")
  }
});

Example