Question

我有记录表。其中包含删除选项。当点击删除时，它将弹出一个文本区域，然后单击确定弹出它将删除该记录。它仅适用于第一条记录。当我点击第二条记录时它无法正常工作。我以为这是id问题。但我没有想到解决这个问题。

这是我的代码。

<%for(int i=0;i<joborderlist.size();i++){ %>
        <tr>
            <td><%=i+1 %></td>
            <td><%=joborderlist.get(i).getSno()%></td>
            <td><%=joborderlist.get(i).getJobCreatesOnasString()%></td>
            <td><%=joborderlist.get(i).getCaseno()%></td>
            <td><%=joborderlist.get(i).getAdjustername()%></td>
            <td><%=joborderlist.get(i).getOwnername()%></td>
            <td><a href="#" style="text-decoration:none;border-bottom:1px solid black;" id="delete">Cancel
                </a>
            </td>

             </tr>
        <div id="backsheet"></div>
            <div id="popupBox">
                  <span class="buttonClose">X</span> 
                  <div id="top1">
                </div><BR><BR>
                  <form class="form-horizontal" role="form" action="${pageContext.request.contextPath}/DeleteRecords" method="post" id="wlogForm" autocomplete="off">
                    <!-- hidden values -->
                    <input type="hidden" name="joborder_id" value="<%=joborderlist.get(i).getSno()%>" id="branchid">
                    <input type="hidden" name="deleted_by" value="<%=session.getAttribute("emp_email")%>" id="branchid">
                    <span class="title_txt"><span id="add_ttl">Reason :</span></span>
                    <textarea rows="5" cols="50" name="reason" id="reason" style="margin: -34px 7px -30px 6px;"></textarea><br>
                    <br>
                    <br>
                   <div><span id="reasonmsg" style="color: red;margin-right: 190px;"></span></div>
                  <div class="submit"><input id="branchbutton" type="submit" value="Ok" name="submit" onclick="return validation();" style="margin-left: 115px;"/>
                                      <input id="branchbutton" type="button" value="Cancel" name="submit" class="buttonCancel" style="margin: 17px 0px 0px 19px;"/>
                  </div>
                 </form>
               </div>
             <%}%>

这是我的弹出式脚本

<script type="text/javascript">
           $(document).ready(function() {
             $("#delete").click(function() {
                    $('#branchbutton').show();
                    $("#popupBox").show();
                    $("#backsheet").show();
                        $(".buttonClose").click(function() {
                            $("#popupBox").hide();
                            $("#backsheet").hide();
                         });
                   $(".buttonCancel").click(function() {
                        $("#popupBox").hide();
                        $("#backsheet").hide();
                       });
                   });
                });
         </script>

这是我的记录表

请帮帮我。

Answer 1

正确关闭您的首次点击事件，使用$(this).closest('.form-horizontal')获取相关元素：

在链接中添加一个类

<td><a href="#" style="text-decoration:none;border-bottom:1px solid black;" class="cancel">Cancel
                </a>
            </td>

JS：

  <script type="text/javascript">
               $(document).ready(function() {
                 $(".cancel").click(function(e) {
                       e.preventDefault();
                        $(this).closest('tr').find("#backsheet").show();
                   });
                   $(".buttonClose").click(function() {
                       $(this).closest('#backsheet').hide();
                   });
                   $(".buttonCancel").click(function() {
                        $(this).closest('#backsheet').hide();
                   });

                 });
    </script>

你需要知道如果你有一个循环，你需要循环中元素的类

Answer 2

问题只出现在地点 onclick="return validation();"

验证部分有什么作用？

您正在创建的结构也不正确。它将创建表结构，如

<table>
<tr><td></td></tr>
<div></div>
<tr><td></td></tr>
<div></div>
</table>

有时IE可能会为无效的标签结构造成问题。

删除不适用于JSP中使用for循环的每个id

2 个答案: