單擊表中的按鈕會觸發按鈕和表事件

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（“ component”），但這似乎不起作用。 有任何想法嗎？

Answer 1

event.stopImmediatePropagation()

停止事件傳播。 將以上行放在deletecomponent（刪除事件）方法中。

Answer 2

單擊按鈕時，可以使用以下方式停止事件傳播 ：

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