我有一個表,每個tr
有class="ass testPageRow"
我希望能夠全部選擇td
標籤。我目前有一些代碼允許我單獨選擇td
。我正在嘗試實現一個全選按鈕。選擇所有按鈕來選擇td標籤
var testPagesList = document.getElementsByClassName("testPageRow");
for (var i = 0; i < testPagesList.length; i++) {
var testPageItems = testPagesList[i].getElementsByTagName("td");
for (var j = 0; j < testPageItems.length; j++) {
testPageItems[j].onclick = function(event) {
if (this.className == "selected") {
this.className = "unselected";
} else {
this.className = "selected";
}
};
}
}
我的HTML
<table class="table">
<tbody>
<tr class="ass testPageRow">
<td id="tp1">1</td>
<td id="tp4">4</td>
<td id="tp5">5</td>
</tr>
<tr class="ass testPageRow">
<td id="tp12">12</td>
<td id="tp13">13</td>
<td id="tp14">14</td>
</tr>
<tr class="ass testPageRow">
<td id="tp14TTU">14TTU</td>
<td id="tp15">15</td>
<td id="tp16">16</td>
</tr>
<tr class="ass testPageRow">
<td id="tp18">18</td>
<td id="tp20">20</td>
<td id="tp21">21</td>
</tr>
</tbody>
</table>
的格式這裏是我當前的JavaScript代碼來選擇標籤。當我點擊按鈕時,沒有任何反應。我不知道爲什麼。我的邏輯是迭代所有的對象,並將className更改爲selected
,正如我在之前的代碼中所做的一樣。
function selectAllTestPages() {
var selectAllTP = document.getElementById("selectAllTestPages");
selectAllTP.onclick = function(event) {
for (var i = 0; i < testPagesList.length; i++) {
var testPageTDTags = testPagesList[i].getElementsByTagName("td");
for (var td in testPageTDTags) {
td.className = "selected";
}
}
};
}
按鈕點擊:
<div class="center">
<button id="selectAllTestPages">Select All</button>
</div>
所以工作example,有什麼問題了嗎? – 2014-10-28 17:46:27
@AmitJoki更新。抱歉。所以專注於描述我的問題,我忘了說明。 – Liondancer 2014-10-28 17:49:13