jQuery爲它找到的每個元素返回兩個元素？

我會開始說我對jQuery相當陌生。在大多數情況下，我發現它很直觀和強大，但這種情況讓我徹底難倒了。jQuery爲它找到的每個元素返回兩個元素？

在以下方法中，對.each()的調用返回找到的每個元素的兩個元素。它迭代了一組表格行，給出了以「communication」開頭的ID，後面跟着一個ID號碼。對於它返回的每一行，它會處理兩次。

使用Firebug，我已驗證DOM只有每個表格行的單個實例。還使用Firebug，我已驗證該方法未被調用兩次; .each()中的迭代真正遍歷每個返回的錶行兩次。當所有的AJAX調用完成時，我將在數據庫中爲表中創建的每一行創建兩個條目。

這是造成問題的代碼：

function getCommunications() { 
    var list = $('[id^=communication]'); 
    var communications = new Array(); 
    list.each(function() { 
     var communication = { 
      ID: $(this).find('.commCompanyID').val(), 
      /* 
      * SNIP: more object properties here that are 
      * unnecessary to this discussion 
      */ 
     }; 
     communications.push(communication); 
    }); 
    return communications; 
}

截至return communications點，返回包含兩倍多的元素，也有錶行的陣列。

我應該注意，幾乎相同的代碼（但與特定的div列表不同）正在同一頁面上工作。這只是桌子上的問題。

我使用jQuery 1.4.1，它隨Visual Studio .NET中的2010年版

表格標記是完全動態的 - 那就是，除了標題行，它是依賴於數據或者在頁面加載時返回或由用戶通過對話框創建。我只會介紹頁面加載時創建的代碼;再次使用Firebug我已經驗證了當最終用戶使用對話框匹配創建行時，我動態創建的內容。（這應該是任何人讀取，但備案，這是一個ASP.NET MVC 2.0項目。）

<table id="commTable"> 
    <tr> 
     <th></th> 
     <th> 
      Date/Time 
     </th> 
     <th> 
      Contact 
     </th> 
     <th> 
      Type 
     </th> 
     <th> 
      Duration 
     </th> 
     <th> 
      Notes 
     </th> 
    </tr> 
<% foreach (var item in Model) { %> 
    <tr id="communication<%: item.ID %>"> 
     <td> 
      <a href="#" onclick="showEditCommunicationForm(<%: item.ID %>"> 
       Edit</a> 
      <span class="commDeleteButton"> 
       <a href="#" onclick="deleteCommunication(<%: item.ID %>)"> 
        Delete</a> 
      </span> 
     </td> 
     <td> 
      <span class="commDateTime"><%: item.DateTime %></span> 
      <input type="hidden" class="commID" value="<%: item.ID %>" /> 
      <input type="hidden" class="commIsDeleted" 
       value="<%: item.IsDeleted %>" /> 
     </td> 
     <td> 
      <span class="commSourceText"><%: item.Company.CompanyName %></span> 
      <input type="hidden" class="commCompanyID" 
       value="<%: item.CompanyID %>" /> 
     </td> 
     <td> 
      <%: item.CommunicationType.CommunicationTypeText %> 
      <input type="hidden" class="commTypeID" 
       value="<%: item.CommunicationTypeID %>" /> 
     </td> 
     <td> 
      <span class="commDuration"><%: item.DurationMinutes %></span> 
      Minutes 
     </td> 
     <td> 
      <span class="commNotes"><%: item.Notes %></span> 
     </td> 
    </tr>  
<% } %> 
</table>

來源

2010-06-11 John Rudy

你能提供表格標記嗎？ – jAndy 2010-06-11 13:56:38

@jAndy：完成。這有點...在...大的一方。 – 2010-06-11 14:05:38

'alert（$（'[id^= communication]'）。length）;'給你嗎？你確定桌子的祖先沒有以'communication'開頭的ID嗎？ – Matt 2010-06-11 14:10:47

alert($('[id^=communication]').length);給你什麼？你確定桌子的祖先沒有以通信開始的ID嗎？

你可以使用$('#commTable > tr[id^=communication]')是非常具體

來源

2010-06-11 14:20:03 Matt

嘗試

var list = $('[id^=communication]').find('td');

來源

2010-06-11 14:12:03 jAndy

我有兩個建議 - 無論他們幫忙，誰知道。 :)

首先，使用更簡潔的選擇器，即$("tr[id^=communication]")。這將是更快。

其次，考慮只爲您的tr元素添加一個類。這也將是更快。這將需要改變：

<tr id="...">

，例如，

<tr id="..." class="comm-row">

這樣，你的list選擇可以$("tr.comm-row")。

我不明白爲什麼你會得到重複，但也許上述建議不僅會加速代碼，還會提供一些有關重複發生的原因。

在each循環中設置斷點可能會提供一些見解（即，每次迭代時this的值是什麼）。

希望有所幫助。

來源

2010-06-11 14:17:54

我不知道這是否會回答你的問題，但我遇到了與動態生成的表類似的問題。

我使用jQuery可選擇的用戶界面，並根據狀態標誌製作了一張圖像表。然而，我傳遞給jQuery插入的HTML字符串是沿着行的

<img src="images/imageIwant" class="classIwant"></img>

Firefox知道我的意思，只插入一個圖像標記。但是，在IE（7,8）中，我看到類似於

<img ... /> 
</img/>

請檢查瀏覽器開發人員工具中的HTML。你可能會插入兩倍於你想象的元素。

來源

2012-12-03 21:39:05 Caleb

jQuery爲它找到的每個元素返回兩個元素？

回答

相關問題