⑴ 如何用jQuery实现checkbox全选
全选：
$(":checkbox").attr("checked","checked");
全不选：
$(":checkbox").removeAttr("checked");
反选：
$(":checkbox:checked").removeAttr("checked");
$(":checkbox:not(:checked)").attr("checked","checked");
全手写，没有经过测试。
完整代码如下，测试通过：
<html>
<head>
<title>如何用jQuery实现checkbox全选</title>
<scriptsrc="jquery-1.7.1.min.js"></script>
<scripttype="text/javascript">
//全选，全不选
functionallSelect(){
if($(":checkbox").attr("checked")!="checked"){
$(":checkbox").attr("checked","checked");
}
else{
$(":checkbox").removeAttr("checked");
}
}
//反选
functionotherSelect(){
$(":checkbox").each(function(){
if($(this).attr("checked")=="checked"){
$(this).removeAttr("checked");
}
else{
$(this).attr("checked","checked");
}
});
}
</script>
</head>
<body>
<inputid="Checkbox1"type="checkbox"/>
<inputid="Checkbox2"type="checkbox"/>
<inputid="Checkbox3"type="checkbox"/>
<inputid="Checkbox4"type="checkbox"/>
<inputid="Checkbox5"type="checkbox"/>
<inputid="Button1"type="button"value="全选"onclick="allSelect();"/>
<inputid="Button3"type="button"value="反选"onclick="otherSelect();"/>
</body>
</html>
⑵ JS如何实现对name是数组的复选框的全选和反选以及取消选择 form内容如下：
不明白你的意思。<input type='checkbox' name='ptpt[1]' value='a1' />
我的理解就是你想获取多选框的值和他名字的值（不理解就是名字的字符串值还是所代表数组的值）。
你可以把多选框的名字都写成一样的，再给多选框多加一个属性，里面存储你想获得的ptpt值，像下面这样
<input type='checkbox' name='p' value='a1' ptpt='ptpt[1]'/>
<input type='checkbox' name='p' value='a2' ptpt='ptpt[2]'/>
这样在获得选中的多选框后直接取ptpt属性的值就可以拿到你想要的ptpt的值了。
⑶ JS如何实现全选
简单的如下，从后台读取数据的时候为每家店铺的商品单独加类
<!DOCTYPEhtml>
<html>
<head>
<metacharset="UTF-8">
<scriptsrc="https://cdn.bootcss.com/jquery/2.0.0/jquery.js"></script>
<title></title>
</head>
<body>
<div><inputtype="checkbox"class="classA"/>店铺：test1</div>
<div><inputtype="checkbox"name="nameA"/></div>
<div><inputtype="checkbox"name="nameA"/></div>
<div><inputtype="checkbox"name="nameA"/></div>
<div><inputtype="checkbox"name="nameA"/></div>
<div><inputtype="checkbox"name="nameA"/></div>
<div><inputtype="checkbox"class="classB"/>店铺：test2</div>
<div><inputtype="checkbox"name="nameB"/></div>
<div><inputtype="checkbox"name="nameB"/></div>
<div><inputtype="checkbox"name="nameB"/></div>
<div><inputtype="checkbox"name="nameB"/></div>
</body>
<script>
$(function(){
$(".classA").change(function(){
varstatus=$(".classA").prop("checked");
$("input[name='nameA']").attr("checked",status);
})
$(".classB").change(function(){
varstatus=$(".classB").prop("checked");
$("input[name='nameB']").attr("checked",status);
})
})
</script>
</html>
⑷ 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程序设计有所帮助。
⑸ js 脚本怎样实现checkbox的全选，反选，类似邮箱中邮件的全选后删除移动
在页眉的checkbox属性中添加这个事件onclick="CheckAllCus()",不过页眉中的checkbox要用html服务器控件.然后在用javascript实现,如下:
<script language="javascript">
function CheckAllCus()
{
for (var k=0;k<document.Form1.elements.length;k++)
{
var e = document.Form1.elements[k];
if (e.id!= 'checkAccept')
e.checked = document.Form1.checkAccept.checked;
}
}
模板列如下：
<asp:TemplateColumn>
<HeaderTemplate>
<INPUT language="javascript" id="chkAll" onclick="CheckAll(this);" type="checkbox" name="chkAll">选择
</HeaderTemplate>
<ItemTemplate>
<INPUT language="javascript" id="checkbox<%#Container.ItemIndex%>" type="checkbox" value="<%#DataBinder.Eval(Container.DataItem,"字段名字")%>" name="VocationId">
</ItemTemplate>
</asp:TemplateColumn>
这里可以
CheckAll函数如下,记得把函数中的frmList改成你的Form的名字:
function CheckAll(CheckBox)
{
var i;
var str = new String();
for ( i = 0; i < frmList.length; i++ )
{
str = frmList.item(i).id;
if ( str.substr(0,8) == "checkbox" )
{
if (frmList.item(i).disabled != true)
{
frmList.item(i).checked = CheckBox.checked;
if (CheckBox.checked == true )
{
//document.all.item("chk" + str.substr(8,9)).className = "";
//document.all.item("chk" + str.substr(8,9)).bgColor ="#ffdfbd";
}
else
{
//changeColor(frmList.item(i));
}
}
}
}
}
<script language="javascript">
//B100547 chen.p may select or unselect all checkbox
function SelectAll()
{
var arrInputControls;
arrInputControls = document.Form1.all;
for(i=0;i<arrInputControls.length;i++)
{
if((arrInputControls(i).tagName.toLowerCase() == "input") && (arrInputControls(i).type) && (arrInputControls(i).type.toLowerCase() == "checkbox") )
{
arrInputControls(i).checked = document.Form1.chkCheckAll.checked;
}
}
}
</script>
<%@ Page language="c#" Codebehind="WebForm2.aspx.cs" AutoEventWireup="false" Inherits="BS_Demo.WebForm2" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm2</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
function SelectAll(thisObject)
{
var tmpTable=thisObject.parentElement.parentElement.parentElement;
var rowsCount=tmpTable.rows.length;
var buttonText=thisObject.value;
var selected=true;
if(buttonText == "本页全选"){thisObject.value="清除选择";}else{thisObject.value="本页全选";selected=false}
var i;
for(i=1;i<rowsCount;i++)
{
var tmpCell=tmpTable.rows[i].cells[0];
if(tmpCell.childNodes.length>0)
{
var objCheck = tmpTable.rows[i].cells[0].childNodes[0];
if(objCheck.id.indexOf("ChkSelect")>-1)
{
objCheck.checked=selected;
//SelectOne(objCheck);
}
}
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:DataGrid id="DataGrid1" style="Z-INDEX: 102; LEFT: 264px; POSITION: absolute; TOP: 192px"
runat="server">
<Columns>
<asp:TemplateColumn>
<HeaderTemplate>
<INPUT id="btnSelect" style="FONT-WEIGHT: bold; WIDTH: 56px; CURSOR: hand; COLOR: blue; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 20px; BACKGROUND-COLOR: transparent; TEXT-DECORATION: underline; BORDER-BOTTOM-STYLE: none"
onclick="SelectAll(this);" type="button" value="本页全选" name="btnSelect">
</HeaderTemplate>
<ItemTemplate>
<INPUT id="ChkSelect" type="checkbox" name="ChkSelect" runat="server" >
</asp:textbox>
</ItemTemplate>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
</form>
</body>
</HTML>