正文
javascript反选,javascript中取反
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
js全选，反选，取消
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
html
head
title New Document /title
script type="text/javascript"
//全选
function test()
{
var f=document.getElementsByName("game");
for(var i=0;if.length;i++)
{
if(f[i].checked==false)
{
f[i].checked=true;
}
}
}
//反选
function ftest()
{
var f=document.getElementsByName("game");
for( var i=0;if.length;i++)
{
if(f[i].checked==false)
{
f[i].checked=true;
}
else
{
f[i].checked=false;
}
}
}
//全部取消
function CancelAll()
{
var f=document.getElementsByName("game");
for( var i=0;if.length;i++)
{
if(f[i].checked==true)
{
f[i].checked=false;
}
}
}
/script
/head
body
input name="game" type="checkbox" value="lanqiu"/篮球
input name="game" type="checkbox" value="zuqiu"/足球
input name="game" type="checkbox" value="pingpangqiu"/乒乓球
input name="game" type="checkbox" value="bangqiu"/棒球
input name="game" type="checkbox" value="ganlanqiu"/橄榄球br/
input type="button" value="全选" onclick="test()"/
input type="button" value="反选" onclick="ftest()"/
input type="button" value="全不选" onclick="CancelAll()"/
/body
/html
把if(f[i].checked=true) 改为 if(f[i].checked==true)
相关问答
Q1: javascript 复选框反选怎么做 正选可以了
!DOCTYPE html
html
head
meta charset="gb2312"
title/title
script
window.onload = function(){
var obtn1 = document.getElementById('btn1');
var obtn2 = document.getElementById('btn2');
var obtn3 = document.getElementById('btn3');
var odiv = document.getElementById('div1');
var ocheck = odiv.getElementsByTagName('input');
obtn1.onclick = function(){ //全选
for(var i=0;iocheck.length;i++){
ocheck[i].checked = true;
}
};
obtn2.onclick = function(){ //不选
for(var i=0;iocheck.length;i++){
ocheck[i].checked = false;
}
};
obtn3.onclick = function(){ //反选
for(var i=0;iocheck.length;i++){
ocheck[i].checked = !ocheck[i].checked;
}
};
}
/script
/head
body
input type="button" id="btn1" value="全选" /
input type="button" id="btn2" value="不选" /
input type="button" id="btn3" value="反选" /
div id="div1"
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
input type="checkbox" /br /
/div
/body
/html
Q2: html 中的 javascript 全选/反选问题
html
head
meta http-equiv="Content-Type" content="text/html; charset=UTF-8"
titlecheck test/title
/head
body
form name="formGroup" id="formGroup" action="#" method="post" target="_self"
table border="1" cellpadding="2" cellspacing="1" class="table_hide"
tr class="table_title"
td width="50" align="center" class="text_center"序号/td
td width="40" align="center" class="text_center"选择/td
td width="100" align="center"/td
td width="100" align="center"/td
/tr
tr
td align="center" class="text_center"1/td
td align="center" class="text_center"input name="groupCheckbox" type="checkbox" value="" class="input_hide"/td
td align="center"/td
td align="center"/td
/tr
tr
td align="center" class="text_center"2/td
td align="center" class="text_center"input name="groupCheckbox" type="checkbox" value="" class="input_hide"/td
td align="center"/td
td align="center"/td
/tr
tr
td align="center" class="text_center"3/td
td align="center" class="text_center"input name="groupCheckbox" type="checkbox" value="" class="input_hide"/td
td align="center"/td
td align="center"/td
/tr
tr
td align="center"全选/td
!-- 复选框单击方式 --
td align="center"input name="" type="checkbox" class="input_hide" onClick="CheckSelect(this.form);return false;" value=""/td
!-- 按钮方式，本质无区别 --
td align="center"input name="" type="button" class="input_hide" onClick="CheckSelect(this.form);return false;" value="选/反选"/td
td align="center"/td
/tr
/table
/form
/body
script type="text/javascript"
// 选择或者反选 checkbox
function CheckSelect(thisform)
{
// 遍历 form
for ( var i = 0; i thisform.elements.length; i++)
{
// 提取控件
var checkbox = thisform.elements[i];
// 检查是否是指定的控件
if (checkbox.name === "groupCheckbox" checkbox.type === "checkbox" checkbox.checked === false)
{
// 正选
checkbox.checked = true;
}
else if (checkbox.name === "groupCheckbox" checkbox.type === "checkbox" checkbox.checked === true)
{
// 反选
checkbox.checked = false;
}
}
}
/script
/html
运行效果：
