無法找到頁面上的所有表格

Question

我正在使用asp.net並在頁面上放置了兩個引導模塊，它們都包含表單元素。 asp.net也帶來了一個表單，它包含了所有內容，所以我總共應該在頁面上有3個表單。每當我嘗試找到第二個窗體（DevGroupFormEdit）時，jquery無法找到它，返回undefined。如果我嘗試$("form").length我得到2，它顯示一個是asp.net窗體（id = aspnetForm）其他是第三個（id = newDevGroupForm）。下面是兩個模態，它們都包含在同一個父DIV：

<div class="modal fade" id="editDevGroupModal" tabindex="-3" role="dialog" aria-hidden="true" data-bind="with: selectedTag"> 
    <div class="modal-dialog"> 
     <form id="DevGroupFormEdit"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
        <h4 class="modal-title">Edit Dev Group</h4> 
       </div> 
       <div class="modal-body"> 

        <div class="form-horizontal"> 
         <div class="form-group"> 
          <label class="col-md-3 paddingTop3"> 
           Group Name: 
          </label> 
          <div class="col-md-9"> 
           <input type="text" id="txtEditName" name="txtEditName" class="form-control" data-bind="value: copyname" /> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" id="btnCancelEdit" class="btn btn-primary btn-sm buttonsize" data-dismiss="modal">Cancel</button> 
        <button type="button" id="btnSave" class="btn btn-primary btn-sm buttonsize">Save</button> 
        <div class="marginTop10"> 
         <span class="label-danger" id="lblErrorEdit" style="display: none;">An error occurred while saving this record.</span> 
        </div> 
       </div> 
      </div> 
      <!-- /.modal-content --> 
     </form> 
    </div> 
    <!-- /.modal-dialog --> 
</div> 
<!-- /.modal --> 

和其中一個jQuery是能夠找到的是：

<div class="modal fade" id="newDevGroupModal" tabindex="-2" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <form id="newDevGroupForm"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
        <h4 class="modal-title">Create New Dev Group</h4> 
       </div> 
       <div class="modal-body"> 

        <div class="form-horizontal"> 
         <div class="form-group"> 
          <label class="col-md-3 paddingTop3"> 
           Group Name: 
          </label> 
          <div class="col-md-9"> 
           <input type="text" id="txtNewDevGroupName" name="txtNewDevGroupName" class="form-control" /> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-primary btn-sm buttonsize" data-dismiss="modal">Cancel</button> 
        <button type="button" id="btnSaveNew" class="btn btn-primary btn-sm buttonsize">Save</button> 
        <div class="marginTop10"> 
         <span class="label-danger" id="lblNewError" style="display: none;">An error occurred while creating this record.</span> 
        </div> 
       </div> 
      </div> 
      <!-- /.modal-content --> 
     </form> 
    </div> 
    <!-- /.modal-dialog --> 
</div> 
<!-- /.modal --> 

他們都非常相似，只是不知道爲什麼第二個（id = DevGroupFormEdit）一直返回undefined，或者爲什麼$（'form'）也無法找到它。

Answer 1

「asp.net帶來了一種形式，也是這樣的包裝一切」

這是你的問題。你不能嵌套表單。如果你檢查元素，你會注意到你的<form>標籤被DOM剝離了。

修復的唯一方法是不嵌套窗體。

備註：在測試中，Firefox和Chrome刪除了一個表單標記並將其他嵌套。 IE刪除了一個表單標籤，並將第二個表單移到了包裝所有內容的「asp.net」表單之外。