javascript 如何自动检查所有具有相同名称的复选框?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6007863/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 19:07:47  来源:igfitidea点击:

How to auto check all checkboxes with same name?

javascriptjsp

提问by rohit_mishra

I have used checkboxes for checking the mails in my mailing system which is developed in Java.

我使用复选框来检查我用 Java 开发的邮件系统中的邮件。

I want to check all the checkboxes on the click of upper checkbox, but the problem is there that checkboxes are displayed in the the loop according to number of mails retrieved.

我想在单击上方复选框时检查所有复选框,但问题是根据检索到的邮件数量在循环中显示复选框。

Please help me where should i put the javascript code to solve this problem.

请帮我把javascript代码放在哪里来解决这个问题。

The loop code of inbox is given below:

收件箱循环代码如下:

<tr >
        <% for(int i=0;i<messageList.size();i++) { message = (Message)messageList.get(i);%>
        <td width="10%" height="33" align="left"   valign="top" bgcolor="#EEE" >
        <!--This link display the full message-->


        <input name="Mark_Mail" id="mark_mail" onclick="myfunction(this);" type="checkbox" value="<%=message.getMailId()%>" width="50" height="30" align="top" >
        <span id="space1" style="padding:2px"></span>

        <!--Check all the Checkboxes-->
        <script type="text/javascript">
        function checkAll()
        {
            document.getElementById('mark_mail').checked = "true";
        }

        </script>

        <img  src="Images/UnStarred.jpg" height="15" border="0"  id="image1" onclick="swapImage()" />
        <span id="space1" style="padding:2px"></span>
        </td>
        <td width="90%" height="33" align="left" colspan="7"  valign="bottom" bgcolor="#EEE" >
        <!--This link display the full message-->
        <a  id="link" href="viewMail.jsp?mailId=<%=message.getMailId()%>&isAttach=<%=message.getAttachmentFlag()%>">
        <!--Display Sender Address-->
        <font color="#000000" size="1"><strong><%=message.getSenderAddress()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Message Subject-->
        <font color="#000000" size="1"><strong><%=message.getSubject()%></strong></font>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Attachment Image-->
        <%if(message.getAttachmentFlag().equals("1")){%><input type="hidden" name="filename" id="filename" value="<%=message.getFileName()%>" /><input type="hidden" name="filesize" id="filesize" value="<%=message.getFileSize()%> /><img src ="Images/attachment.jpg" style="bgcolor: #EEE" /><%}else{%><span style="padding-left:12px" ></span><%}%>
        <span id="space1" style="padding:6px"></span>

        <!--For Display Time and Date of messaging-->
        <font color="#000000" size="1"><strong><%=message.getTimestamp()%><span style="padding-left:5px"></span><%=message.getDate()%><input type="hidden" name="label" value="<%=message.getLabel()%>"></strong></font>
        </a></td>
        </tr><% } %>

回答by Shadow Wizard is Ear For You

You need to get the elements by their name, as ID must be unique:

您需要按名称获取元素,因为 ID 必须是唯一的:

function checkAll() {
   var arrMarkMail = document.getElementsByName("mark_mail");
   for (var i = 0; i < arrMarkMail.length; i++) {
      arrMarkMail[i].checked = true;
   }
}

Just place this code in the <head>section of the page.

只需将此代码放在<head>页面的部分中即可。

To call it, have such checkbox wherever you like: Master: <input type="checkbox" onclick="checkAll();" />
However this better be done by a button:

要调用它,在任何你喜欢的地方都有这样的复选框: 大师:<input type="checkbox" onclick="checkAll();" />
但是最好通过一个按钮来完成:

<button type="button" onclick="checkAll();">Check All</button>