[原] 页面checkbox “全选定” 和 “全取消” 操作的实现(JavaScript)
Web开发时,页面上常常需要对checkbox实现全选定 和 全取消的操作。
页面的HTML代码
<input type='checkbox' name='info' value='a'>
<input type='checkbox' name='info' value='b'>
<input type='checkbox' name='info' value='c'>
<input type='checkbox' name='info' value='d'>
<input type='checkbox' name='info' value='e'>
<br/>
<input type='button' value =' 全选定 'onclick='check_all();'>
<input type='button' value =' 全取消 'onclick='check_all_un();'>
<input type='checkbox' name='info' value='b'>
<input type='checkbox' name='info' value='c'>
<input type='checkbox' name='info' value='d'>
<input type='checkbox' name='info' value='e'>
<br/>
<input type='button' value =' 全选定 'onclick='check_all();'>
<input type='button' value =' 全取消 'onclick='check_all_un();'>
对应的JavaScript代码
<script>
function check_all()
{ // 全选定
arr = document.getElementsByName('info');
for(i=0;i<arr.length;i++)
{
arr[i].checked = true;
}
}
function check_all_un()
{ // 全取消
arr = document.getElementsByName('info');
for(i=0;i<arr.length;i++)
{
arr[i].checked = false;
}
}
</script>
function check_all()
{ // 全选定
arr = document.getElementsByName('info');
for(i=0;i<arr.length;i++)
{
arr[i].checked = true;
}
}
function check_all_un()
{ // 全取消
arr = document.getElementsByName('info');
for(i=0;i<arr.length;i++)
{
arr[i].checked = false;
}
}
</script>