javascript的全选和显示/隐藏

最新推荐文章于 2024-10-21 14:52:58 发布

最新推荐文章于 2024-10-21 14:52:58 发布 · 136 阅读

文章标签：

#JavaScript #ViewUI

javascript 专栏收录该内容

39 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现的前端表格操作方法，包括全选功能和显示/隐藏职位信息的功能。通过简单的JavaScript函数，可以轻松地为表格添加交互性，提高用户体验。

[code]<script type="text/javascript">
//全选
function selectAll(box){
var check = box.checked;
var boxes = document.getElementsByName("posIds");
for(var i=0;i<boxes.length;i++){
boxes[i].checked = check;
}
}
//显示/隐藏
function toggleAll(box){
var style = box.checked?"block":"none";
var divs = document.getElementsByName("desc");
for(var i=0;i<divs.length;i++){
divs[i].style.display = style;
}
}
</script>[/code]

.....................................
.....................................
选择所有<input type="checkbox" onclick="selectAll(this)"/>
显示职位信息 <input type="checkbox" onclick="toggleAll(this);" checked="checked"/>
............................................


<input type="checkbox" value="<%=dp.getPosId() %>" name="posIds" disabled="disabled"/>


<tr id="desc" name="desc">
<td ><%=dpDao.getMap().get(new Integer(dp.getPosId())) %></td>
</tr>