Javascript Jquery'；单击'；当图标在按钮上时不触发

我使用

Bootstrap

和

jQuery

。我有三个按钮，每个按钮上都有一个图标。当我将

单击

-事件绑定到按钮时，当我单击按钮（在边缘上）时，它会工作，但当我单击按钮中间的图标时，它不会工作

我的代码如下所示：

<div class="btn-group">
   <button class="btn btn_change_status" id="134" rel="tooltip" data-original-title="Tooltip">
      <i class="icon-eye-open"></i>
   </button>
   ... 
</div>

...

$('button.btn_change_status').on('click', function(e) {
   alert(e.target.id);
   return false;
});

... 
...
$（'button.btn\u change\u status'）。打开（'click'，函数（e）{
警报（如target.id）；
返回false；
});

---

如何将我的

btn\u change\u status

包装的所有元素绑定到单击事件？

使用以下语法

---

您需要不同的语法，如下所示：

---

使用以下内容更新css。我假设你的图标上不需要鼠标事件

.icon-eye-open {

    pointer-events:none;
}

---

您是否尝试过

$（文档）。在（'click'，'button.btn_change_status'，函数（e）{…}）上甚至
$（'button'）。在（'click'，'btn_change_status'，函数（e）{…}）上？无论如何，谢谢你的回答。很好<代码>.btn_更改_状态
，而不是状态

）谢谢你的回答，但是现在看来js坏了，因为它什么都不做。。。当我点击按钮时，什么都没发生…谢谢你的回答，但是现在看来js坏了，因为它什么都没做。。。当我点击按钮时，什么也没发生……谢谢，这是vue.js v-on唯一有效的方法：点击，因为我不能以其他方式附加此事件+100

$('body').on('click', 'button.btn_change_status', function(e) {
   alert(e.target.id);
   return false;
});

.icon-eye-open {

    pointer-events:none;
}