我有一个表,每个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