在表行中,我点击了类似onclick=“trdetailsmodal(this,'id')”
的事件,我正在显示模式中的细节。 所以在tr中,我在操作td下还有两个按钮,这些按钮也有onclick事件,比如onclick=“deleteRecord('id')”
;
我能够通过点击TR在一个模式中看到细节。
现在的问题是,当我单击其中一个按钮时,tronclick
也会被触发,并在模型中显示细节。
那么如何在单击其中一个按钮时停止tronclick
。
代码:
$content .= '<tr class="trClass" onclick="trDetail(this, '.$val->id.');">';
$content .= '<td>some value</td>';
$content .= '<td><button onclick="deleteRecord('.$val->id.')"></td>';
$content .= '</tr>';
function deleteRecord(id){
$(".trClass").off("click");
$("#myModal").hide();
}
这通常是通过对按钮的click事件调用stopPropagation来实现的,这可以防止事件冒泡。
请参见下面的示例:您将注意到,当您单击按钮时,您只看到“按钮单击”的控制台日志,而不是“行单击”。 这是因为stoppropagation
阻止了tr
的click事件激发。
null
$('tr').on('click', function(e){
console.log('row clicked');
});
$('.delete').on('click', function(e){
e.stopPropagation();
console.log('button clicked');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tr>
<td> my row </td>
<td> <button class='delete'>delete</button> </td>
</tr>
</table>
您需要已触发的事件,并且您需要停止其传播