使用javaScript添加的引导开关不会触发事件

编辑，请转到下面

我有一个表，每行有一个行单击事件。问题是我在最后一列BootstrapSwitch中添加了一个开关，该开关既不会触发状态更改，也不会触发click事件，因为行click事件与之重叠。我知道该事件是有效的，因为如果我将开关放在任何其他位置，它就会起作用

是否所有行中都有row事件，只有一列

// Switch event
$('[name="my-checkbox"]').on('switchChange.bootstrapSwitch',  function(event, state) {
  console.log(this); // DOM element
  console.log(event); // jQuery event
  console.log(state); // true | false
});

// row click
$(document).on('click','.rowDev', function(e) {
    e.preventDefault();
    // more code
});

编辑

提供的答案应该对我有帮助，但我注意到另一个问题。点火事件问题。用JScript将开关附加到表中，初始化可能不起作用，因为任何动态添加的开关都起作用，只是我在.html上手动添加的开关

这是我添加到表中的行

"<td><input class='make-switch' type='checkbox' name='my-checkbox' "+ (!anyUnattendedAlert?"checked ":"")+"data-on-color='success' data-off-color='danger' data-on-text='Si' data-off-text='No'>" +
                                    "</td>"+

还尝试初始化我添加的每一行。 我一直在尝试其他没有row事件的表，但仍然没有触发下面评论中提供的switch事件

仍然不知道如何添加这些开关并初始化它们以使其工作

注意：css和js可以工作，因为手动添加的开关会触发事件

---

谢谢

您可以通过在启动开关控件上触发的单击事件上调用StopRopagation来解决此问题。这将阻止事件在DOM中冒泡并在父对象上触发。rowDev:

请注意，如果愿意，也可以将两个事件处理程序合并到一个on-call中：

$('[name="my-checkbox"]').on({
  'switchChange.bootstrapSwitch': function(e, state) {
    console.log(this); // DOM element
    console.log(e); // jQuery event
    console.log(state); // true | false
  }, 
  'click': function(e) {
    e.stopPropagation();
  }
});

---

您可以通过在引导开关控件上触发的click事件上调用StopRopagation来解决此问题。这将阻止事件在DOM中冒泡并在父对象上触发。rowDev:

请注意，如果愿意，也可以将两个事件处理程序合并到一个on-call中：

$('[name="my-checkbox"]').on({
  'switchChange.bootstrapSwitch': function(e, state) {
    console.log(this); // DOM element
    console.log(e); // jQuery event
    console.log(state); // true | false
  }, 
  'click': function(e) {
    e.stopPropagation();
  }
});

---

你能发布点击处理程序的完整代码吗？你能发布点击处理程序的完整代码吗？我认为代码应该是答案，但仍然没有触发事件，注意到另一个错误。编辑问题。我认为代码应该是答案，但仍然没有触发事件，注意到另一个错误。编辑问题。

$('[name="my-checkbox"]').on({
  'switchChange.bootstrapSwitch': function(e, state) {
    console.log(this); // DOM element
    console.log(e); // jQuery event
    console.log(state); // true | false
  }, 
  'click': function(e) {
    e.stopPropagation();
  }
});