当用户点击复选框时如何停止调用函数

Question

我有一个表行。在表行我有复选框和许多其他信息。现在，我应该打开另一个页面，而点击行。但需要执行另一个功能，而单击复选框。这里，复选框也是行的一部分，因此，如果我要单击复选框，它将打开另一个分配给行的页面。

<tr onclick="window.location='openticket.php';" class="cursor1">
<td>
<div class="classic">

<div class="row ms-2" id="<?php echo $i['id']; ?>" onmouseover="display(<?php echo $i['id']; ?>)" onmouseleave="display2(<?php echo $i['id']; ?>)">

<div class="col-1 mt-1 returnhide" id="hidecheckbox<?php echo $i['id']; ?>" style="display:none;">
<div class="form-check">
<input class="form-check-input checkboxcheckvalueofrow" type="checkbox" id="cb<?php echo $i['id']; ?>" name="ticketcheckbox[]" value="<?php echo $i['ticket_id']; ?>">
</div>
</div>
</td>

<td>Database issue</td>
</tr>   

这是我的代码。如果我单击复选框，Openticket.php页面不应该打开。怎么做呢?

Answer 1

您可以将onClick属性添加到将使用event.stopPropagation的复选框html元素。请参阅下面带有onClick属性的代码:

<tr onclick="window.location='openticket.php';" class="cursor1">
<td>
<div class="classic">
<div class="row ms-2" id="<?php echo $i['id']; ?>" onmouseover="display(<?php echo $i['id']; ?>)"
onmouseleave="display2(<?php echo $i['id']; ?>)">
<div class="col-1 mt-1 returnhide" id="hidecheckbox<?php echo $i['id']; ?>" style="display:none;">
<div class="form-check">
<input class="form-check-input checkboxcheckvalueofrow" type="checkbox"
onclick="event.stopPropagation()" id="cb<?php echo $i['id']; ?>" name="ticketcheckbox[]"
value="<?php echo $i['ticket_id']; ?>">
</div>
</div>
</td>
<td>Database issue</td>
</tr>