Javascript jQuery中包含div和button的不同绑定

因此，我在列表行中有一个按钮，用于从页面中删除该行（调用ajax stuff来删除该行表示的对象，但这对我的问题并不重要）。整行绑定到一个click事件，该事件将重定向到另一个页面

换句话说，包含行是click-bound，内部按钮是click-bound，这导致了我的问题，因为单击内部按钮也会触发包含行的click事件（应该是这样的）

我已尝试为所有删除按钮绑定一个悬停事件，该按钮在鼠标悬停时解除行的绑定，并在鼠标悬停时重新绑定行，如下伪代码所示：

$('.delete-button').hover(
  function() {
    $('.list-row').unbind();
    $('.delete-button').bind('click', function() { /* delete action */ });
  },
  function() {
    $('.delete-button').unbind();
    $('.list-row').bind('click', function() { /* list row action */ });
  }
);

这样做效果不太好，我相信有更好的方法。我应该将按钮从包含列表行中取出吗？将它放在那里更容易，因为我的列表行包含自定义属性，这些属性包含ajax调用所需的数据，我可以

var rid=$（'.delete button）.parent（）.attr（'row-id'）

获取数据，但我不反对更改：）

---

谢谢

在按钮的单击事件处理程序中，需要调用

e.stopPropagation（）

。这将防止事件在DOM树中冒泡。更多信息请点击此处：

---

编辑：您已经接受了（谢谢！），但是这个代码片段可能有助于更好地解释一些概念：

$('.list-row').click(function() {
    /* list row action */
});

$('.delete-button').click(function(e) {
    // die, bubbles, die
    e.stopPropagation();
    // if you also need to prevent the default behavior for the button itself,
    // uncomment the following line:
    // e.preventDefault();
    // note that if you are doing both e.stopPropagation() AND e.preventDefault()
    // you should just `return false;` at the end of the handler (which is jQuery-
    // sugar for doing both of these at once)

    /* delete action */
})

---

让处理程序函数返回false有几种方法。正如@jmar777已经说过的，您可以将一个修改过的事件附加到按钮上的click处理程序，从而停止传播

如果要使用与应用于div相同的函数执行此操作，则可以按如下方式进行处理：

if($(event.target).is("input")) {
      event.stopPropagation();
}

另一种方法是在浏览器支持单击包含元素的任何时候，实际上不将单击事件绑定到按钮。因为你总是会触发它，那么你实际上也不需要按钮来处理它！这确实需要你处理IE6等与其他事情稍微不同，尽管