Javascript 使用复选框标记要删除的行

我有这个收件箱或邮件，我需要使用复选框标记多次删除。问题是，当我单击复选框时，它总是转到方法read（），因为标记中有onclick。我想要的只是简单的标记。请参阅下面的代码：

@foreach ($messages as $message)    
  <tr onclick="document.location='{{route('account.message.read', array($message->id))}}'">
     <td> <input type="checkbox" name="msg" value="{{$message->id}}"></td>
     <td><strong>{{Str::words($message->subject, 5, '...')}}</strong> {{Str::words($message->message, 20, '...')}}</td>
  </tr>
@endforeach

@foreach（$messages作为$message）
{{Str:：words（$message->subject，5'…'）}{{{Str:：words（$message->message，20'…'）}
@endforeach

---

现在，我如何在不进入该方法的情况下标记每一行？顺便说一句，我是新手。

您可以将onclick放在标签内，不包括复选框单元格

否则，您可以在捕获单击事件时调用实际的onclick函数，并检查x是否大于50px

document.getElementById（'emailRow1'）。addEventListener（“单击”，函数（e）{
var x=e.pageX-this.offsetLeft；
如果（x>50）{
行单击（）；
}
}，对）；

---

此区域不会触发onclick i trigger onclick i trigger onclick

您可以将onclick放在不包含复选框单元格的标记内

否则，您可以在捕获单击事件时调用实际的onclick函数，并检查x是否大于50px

document.getElementById（'emailRow1'）。addEventListener（“单击”，函数（e）{
var x=e.pageX-this.offsetLeft；
如果（x>50）{
行单击（）；
}
}，对）；

---

此区域不会触发onclickI trigger onclickI trigger onclick

您只需将处理程序附加到

复选框

并使用从冒泡到树中，请参见以下示例：

HTML

假设我们有带有

onclick

inlinejavascript的表行，其中有

input

：

<table>
  <tr onclick="return alert('Hai')">
    <td>
        <input type="checkbox" />Click Me
    </td>
  </tr>
<table>

---

您只需将处理程序附加到

复选框

并使用从冒泡到树中，请参见以下示例：

HTML

假设我们有带有

onclick

inlinejavascript的表行，其中有

input

：

<table>
  <tr onclick="return alert('Hai')">
    <td>
        <input type="checkbox" />Click Me
    </td>
  </tr>
<table>

---

如果要选择多个元素，请从

复选框

标记中删除该

onclick

参数。对于多次删除，请创建另一个按钮并添加修改的

onclick

参数，该参数将删除所有标记的元素。@CrakC在我发布的代码中，复选框内没有onclick参数。我不明白，对不起。我想一次标记每一行并删除所有标记的行。好吧，我搞错了。但是，您已经为bounding

tr

标记包含了一个

onclick

参数，这意味着它内部的任何元素在单击时都会触发

onclick

事件。尝试将

onclick

参数添加到

div

或

span

或

p

中，该参数位于

复选框旁边，例如包含电子邮件主题。@CrackC谢谢，您的解决方案有效。Norlihazmey Ghazali在本页中提出了另一个解决方案，我认为它适合我的问题。如果要选择多个元素，请从
复选框中删除
onclick
参数。对于多次删除，请创建另一个按钮并添加修改的
onclick
参数，该参数将删除所有标记的元素。@CrakC在我发布的代码中，复选框内没有onclick参数。我不明白，对不起。我想一次标记每一行并删除所有标记的行。好吧，我搞错了。但是，您已经为bounding
tr
标记包含了一个
onclick
参数，这意味着它内部的任何元素在单击时都会触发
onclick
事件。尝试将
onclick
参数添加到
div
或
span
或
p
中，该参数位于
复选框旁边，例如包含电子邮件主题。@CrackC谢谢，您的解决方案有效。诺里哈兹梅·加扎利在这一页中提出了另一个解决方案，我认为它适合我的问题。谢谢。那会管用的，但我会不断重复，在每个。。我在那一行还有更多的内容，比如邮件的主题和发件人。我编辑了我的答案。我认为上面的代码将通过在html或JScript中实现cutom属性，并通过javascript而不是HREF设置onclick，从而有助于提高页面的可伸缩性@Norilihazmey为您的问题提供了最简单的答案谢谢。你的答案可能有用，而且很好。我同意你的观点，诺里哈兹梅有一个简单的解决方案。谢谢。那会管用的，但我会不断重复，在每个。。我在那一行还有更多的内容，比如邮件的主题和发件人。我编辑了我的答案。我认为上面的代码将通过在html或JScript中实现cutom属性，并通过javascript而不是HREF设置onclick，从而有助于提高页面的可伸缩性@Norilihazmey为您的问题提供了最简单的答案谢谢。你的答案可能有用，而且很好。我同意你的观点，诺里哈兹梅有一个简单的解决方案。谢谢你，这个解决方案很有效。这正是我想要的。谢谢。这个解决方案很有效。正是我要找的。