jQuery：通過更改第一列的值對所有行重新編號

Question

我試圖在給定的開始索引處開始對事件進行重新編號。下面是我的表中的HTML：

<table id="table4"> 
    <tr> 
     <td><span class='col1'>6</span></td> 
     <td>Score</td> 
     <td></td> 
    </tr> 
</table> 

我在以後添加的行與jQuery具有相同的格式（第一列單元格將始終具有<span class='col1'></span>標籤）。

我有一個CSS選擇嘗試這一點，但它不工作（沒有什麼是得到改變）：

var startIndex = 6; 
$("span .col1").text($(this).closest("tr").index() + startIndex); 

這是這樣做的正確方法？我是一個jQuery noob。如果有更好的方法來做到這一點，我很樂意考慮更改我的代碼結構。

Answer 1

有兩件事情你的代碼錯誤：

1. 通過在您選擇"span .col1"你所得到的任何類型的有類「COL1」這是一個span元素的後代的所有元素有空間 - 你的情況是否元素。如果您刪除空間："span.col1"，它將查找所有具有該類的跨度。

2. this在你使用它的地方沒有任何與你選擇的元素有關的東西，它會是別的東西，但我不能說什麼，因爲它取決於你顯示的代碼的位置（在一個函數？全局？）。

以下是我會做：

var startIndex = 6; 
$("span.col1").text(function() { 
    return $(this).closest("tr").index() + startIndex; 
}); 

演示：http://jsfiddle.net/sLg7h/1/

（雖然我可能會說...closest("tr")[0].rowIndex自認爲得到指數，而不是直接讓jQuery的數字出來與.index()。）

.text()方法接受函數，將調用每個匹配ele其中函數的返回將成爲當前元素的新文本​​。更常見的情況是，您可以使用該函數的參數來獲取舊的文本值並對其做些操作，但在這種情況下，您只需設置一個數字，以便舊值無關緊要。儘管在使用this的地方存在問題，但在傳遞給.text()的回調函數中，jQuery將設置this爲當前元素。

而且你可能並不真正需要span元素：你可以只是<td class="col1">與td.col1選擇，但即使你使用選擇"tr td:first-child"拿到首個TD每一行中是沒有必要的...