Question

我有一个表格显示某些组件的信息，在表格的右侧，我有一个删除按钮。截至目前，我已经拥有了它，所以当点击某个组件的行时，它会带您进入一个新页面。由于我的删除按钮也在该行上，因此在单击时会将我带到该页面而不是删除该组件。有没有办法在点击时只激活按钮事件而不是表格的行事件？这是我的HTML的样子：

{{#components}}
<tr class="component" data-id={{id}} data-type={{type}}>
        <td>{{general_name}}</td>
        <td>{{type}}</td>
        <td>
            <button class="btn btn-danger btn-xs glyphicon glyphicon-remove pull-right delete" id="remove" data-id={{id}} data-type={{type}}></button>
        </td>   
    </tr>
{{/components}}

这里有我应该将点击发送到正确位置的javascript事件：

'click #remove' : 'deleteComponent',
'click .component': 'openComponent',

我尝试在我的按钮上使用jQuery的removeClass（＆＃34;组件＆＃34;），但这似乎不起作用。有什么想法吗？

Answer 1

event.stopImmediatePropagation()

停止事件传播。将上面的行放在deletecomponent（remove event）方法中。

Answer 2

使用以下内容点击按钮时，您可以停止event propagation：

$('button').click(function(event) {
  event.stopPropagation();
  //set up your normal button code here...
});

单击时，表中的按钮会触发按钮和表事件

2 个答案: