导航:首页 > 编程语言 > js实现多选框反选

js实现多选框反选

发布时间:2021-02-28 02:16:16

A. javascript如何实现一组复选框反选

var authorities = document.getElementsByName("authorities");
for (var i=0;i<authorities.length;i++)
{
authorities[i].checked=!authorities[i].checked;
}

B. js解决checkbox全选和反选的问题

<script>
functionSelectAll(){
varcheckboxs=document.getElementsByName("choose");
for(vari=0;i<checkboxs.length;i++){
vare=checkboxs[i];
e.checked=!e.checked;
}
}
</script>

<inputtype="checkbox"name="choose">跳舞
<inputtype="checkbox"name="choose">跳水
<inputtype="checkbox"name="choose"/>跳棋
<inputtype="checkbox"name="choose"/>跑步内<br/>
<inputtype="checkbox"name="allChecked"id="allChecked"onclick="SelectAll()"/>全选/取消容

C. 如何用JS实现多选框select的全选和取消全选

你自己改下控件名字就可以了啊!
下面自己放连个文件
---
1.php

<script>
function $(id){

return document.getElementById(id);

}

function checkalls(obj,form){

var bool=(obj.checked)?true:false;
for(var i=0;i<form.length;i++){
form.all[i].selected=bool;
}
}
</script>
<form action="2.php" method="post" >
<input type="checkbox" name="checkall" id="checkall" onclick="checkalls(this,$('select'))" checked>全选<br>
<select multiple name="select[]" id="select" size="15" style="width:210px;height:250px">
<option value="1" selected>顿饭大幅度</option>
<option value="2" selected>大幅度</option>
<option value="3" selected>大幅缩</option>
<option value="4" selected>到司法所</option>

</select>
<INPUT TYPE="submit" value="提交">
</form>

---
2.php

<?
echo $select[0];
echo $select[1];
echo $select[2];
echo $select[3];
?>

D. js实现checkbox全选、不选与反选的方法

本文实例讲述了js实现checkbox全选、不选与反选的方法。分享给大家供大家参考。具体分析如下:
一、思路:
1.
获取元素
2.
给全选
不选
反选添加点击事件
3.
用for循环checkbox
4.
把checkbox的checked设置为true即实现全选
5.
把checkbox的checked设置为false即实现不选
6.
通过if判断,如果checked为true选中状态的,就把checked设为false不选状态,如果checked为false不选状态的,就把checked设为true选中状态。
二、html代码
<input
type="button"
value="全选"
id="sele"/>
<input
type="button"
value="不选"
id="setinterval"/>
<input
type="button"
value="反选"
id="clear"/>
<div
id="checkboxs">
<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
/>
<input
type="checkbox"/><br
/>
<input
type="checkbox"/><br
/>
<input
type="checkbox"/><br
/>
<input
type="checkbox"/><br
/>
<input
type="checkbox"/><br
/>
</div>
三、js代码:
<script>
window.onload=function(){
var
sele=document.getElementById('sele');//获取全选
var
unsele=document.getElementById('setinterval');//获取不选
var
clear=document.getElementById('clear');//获取反选
var
checkbox=document.getElementById('checkboxs');//获取div
var
checked=checkbox.getElementsByTagName('input');//获取div下的input
//全选
sele.onclick=function(){
for(i=0;i<checked.length;i++){
checked[i].checked=true
}
}
//不选
unsele.onclick=function(){
for(i=0;i<checked.length;i++){
checked[i].checked=false
}
}
//反选
clear.onclick=function(){
for(i=0;i<checked.length;i++){
if(checked[i].checked==true){
checked[i].checked=false
}
else{
checked[i].checked=true
}
}
}
}
</script>
希望本文所述对大家的javascript程序设计有所帮助。

E. 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;i<ocheck.length;i++){
ocheck[i].checked = true;
}
};

obtn2.onclick = function(){ //不选
for(var i=0;i<ocheck.length;i++){
ocheck[i].checked = false;
}
};

obtn3.onclick = function(){ //反选
for(var i=0;i<ocheck.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>

F. js控制复选框进行反选时,为什么这种方式不行。【我知道如果checked属性用true/false是w3c标准方法可行。

通过来给 checked 属性复制,只要自 checked 存在,无论是任何值都表示选中。

<inputtype='checkbox'checked/>

这才是 W3C 的标准。注意到没有?checked 属性其实并没有等于号赋值,因为实际上它等于啥都无所谓,只要存在这个属性就是表示选中。

Obox[i].checked='';//选中
Obox[i].checked='checked';//选中
Obox[i].checked='true';//选中
Obox[i].checked='false';//选中
Obox[i].checked=true;//选中
Obox[i].checked=false;//取消选中

input 标签中同理的还有 readonly、autofocus 之类的属性。

G. js怎么控制多个复选框的选中和取消选中

//导入包 <script type="text/javascript" src="admin/a/js/jquery-1.8.0.min.js"></script>

//全选内容反选
$("#chkAll").click(function()
{

if($(this).prop("checked"))
{
$("input[type='checkbox']").prop("checked",true);

$("#chkAll").html("");
}
else
{
$("input[type='checkbox']").prop("checked",false);
$("#chkAll").html("");
}}
)

H. js的全选反选(两组复选框)

jquery 两行搞定
$("input[name='a[]']").attr('checked', true); 所有name为a[]的都选内中容
$("input[name='b[]']").attr('checked', false); 所有name为b[]的都取消选中

I. js实现多选框选中

<HTML>
<HEAD>
<scripttype="text/javascript"src="./jquery-1.11.1.js"></script>
<scripttype="text/javascript">

$(function(){
varcheckbox=$("#test:checkbox");
$("#test:checkbox").click(function(){
varopchek=$(this);
varlevel=parseInt(opchek.attr("level"));
$.each(checkbox,function(){
var_this=$(this);
if(parseInt(_this.attr("level"))<level){
if(opchek.prop("checked")){
_this.prop("checked",true);//这个方法好像是1.8+的jquery才有的
_this.attr("disabled",true);
}else{
varprevLevel=level-1;
$("#test:checkbox[level='"+prevLevel+"']").attr("disabled",false);
}

}
});
});
});
</script>
</HEAD>
<BODY>
<divid="test">
<inputtype="checkbox"id="a"level="1">查看</input>
<inputtype="checkbox"id="b"level="2">添加</input>
<inputtype="checkbox"id="c"level="3">修改</input>
<inputtype="checkbox"id="d"level="4">完全控制</input>
</div>
</BODY>
</HTML>

阅读全文

与js实现多选框反选相关的资料

热点内容
在线处理psd文件 浏览:367
古代电影免费在线观看 浏览:711
淫小说网址 浏览:898
如何在电脑上用数字编程 浏览:178
神豪系统类小说 浏览:46
oa系统怎样批量下载文件 浏览:299
mpp大数据体系 浏览:144
穿越雪中悍刀行收女主的小说 浏览:54
奇怪的美发沙龙剧情介绍 浏览:969
《沐风之女》电影巴巴鱼 浏览:4
psd文件如何转换成cdr 浏览:907
英语课作弊2电影 浏览:584
光盘里文件格式 浏览:423
易天下 著; 浏览:530
struts2上传文件json 浏览:640
可以看那种片的网站 浏览:671
重生古惑仔千人晒马的小说 浏览:15
火影小说 浏览:897
小说女主叫苏沐男主叫陆修 浏览:148
如懿传小说完整版txt 浏览:267

友情链接