當前位置：首頁 » 網購平台 » js購物車全選和反選
擴展閱讀
寧波奧德賽優惠價格 2021-03-15 14:26:02
丹尼斯購物卡能掛失么 2021-03-15 14:25:58
淘寶購物指紋驗證失敗 2021-03-15 14:24:44

js購物車全選和反選

發布時間: 2021-03-01 18:52:25

『壹』 js寫的全選反選，但不夠完善，求指點

<!>
<html>
<head>
<metacharset=UTF-8>
<title>YuGiOh</title>
<styletype="text/css">
</style>
<scripttype="text/javascript">
	onload=function()
{
	varobox=document.getElementById("box");
	varodiv=document.getElementById("div1");
	varach=odiv.getElementsByTagName("input");
	obox.onclick=function()
	{
		for(vari=0;i<ach.length;i++)
		{
			ach[i].checked=this.checked;
		}
	}
	
	for(vari=0;i<ach.length;i++)
	{
		ach[i].onclick=function()
		{
			if(!this.checked)
			{
				obox.checked=false;
			}
		};
	}
}
</script>
</head>
<body>
	<label><inputid="box"type="checkbox"/>全選</label>
	<br>
	<divid="div1">
		<label><inputtype="checkbox"/>1</label><br/>
		<label><inputtype="checkbox"/>2</label><br/>
		<label><inputtype="checkbox"/>3</label><br/>
		<label><inputtype="checkbox"/>4</label><br/>
	</div>
</body>
</html>

『貳』 js全選，反選，取消


<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">
<html>
<head>
<title>NewDocument</title>
<scripttype="text/javascript">
//全選
	functiontest()
	{
	varf=document.getElementsByName("game");
	
		(vari=0;i<f.length;i++)
		{
			if(f[i].checked==false)
			{
				f[i].checked=true;
			}
		}
	}
	//反選
	functionftest()
	{
		varf=document.getElementsByName("game");
		for(vari=0;i<f.length;i++)
		{
			
			if(f[i].checked==false)
			{
				f[i].checked=true;
			}
			else
			{
				f[i].checked=false;
			}
		}
	}
	//全部取消
	functionCancelAll()
	{
		varf=document.getElementsByName("game");
		for(vari=0;i<f.length;i++)
		{
		
			if(f[i].checked==true)
			{
				f[i].checked=false;
			}
		}
	}
</script>
</head>

<body>
	<inputname="game"type="checkbox"value="lanqiu"/>籃球
	<inputname="game"type="checkbox"value="zuqiu"/>足球
	<inputname="game"type="checkbox"value="pingpangqiu"/>乒乓球
	<inputname="game"type="checkbox"value="bangqiu"/>棒球
	<inputname="game"type="checkbox"value="ganlanqiu"/>橄欖球<br/>
	<inputtype="button"value="全選"onclick="test()"/>
	<inputtype="button"value="反選"onclick="ftest()"/>
	<inputtype="button"value="全不選"onclick="CancelAll()"/>

</body>
</html>

把if(f[i].checked=true) 改為if(f[i].checked==true)

『叄』 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全選，反選，全不選

首先選擇器寫法就不對

document.getElementsByName['game']，至少這么寫

其次

由於你所有input標簽所有的name屬性都不一樣，不能批量選擇，除非像樓上貼代碼那哥們一樣，把所有的復選框的name屬性都改為game也可以。如果純粹是為了達到目的話用document.getElementsByTagName("input")，能達到效果

另外，樓上也提到了，判斷的等號==


還有提醒樓主一下，不要反復的使用選擇器，少量代碼無所謂，大量代碼的情況下會降低運算效率的。


在樓主的代碼基礎上改了一下

//全選
	functiontest()
	{
	obj=document.getElementsByTagName("input")
		for(vari=0;i<obj.length-3;i++)
		{
			varf=obj[i];
			if(f.checked==false)
			{
				f.checked=true;
			}
		}
	}
	//反選
	functionftest()
	{
		obj=document.getElementsByTagName("input")
		for(vari=0;i<obj.length-3;i++)
		{
			f=obj[i];
			if(f.checked==false)
			{
				f.checked=true;
			}
			else
			{
				f.checked=false;
			}
		}
	}
	//全部取消
	functionCancelAll()
	{
		obj=document.getElementsByTagName("input")
		for(vari=0;i<obj.length-3;i++)
		{
			f=obj[i];
			if(f.checked==true)
			{
				f.checked=false;
			}
		}
	}

『伍』 JS無法實現全選和反選 應該怎麼改

有幾個地方可能有問題：

  1. 部分瀏覽器不支持form1.這種方法訪問控制項，使用document.方法。


if(elements[i].type=='checkbox') {

if(elements[i].checked==false){
elements[i].checked=true;}}


這樣內寫會比較好容點：

if (elements[i].type == 'checkbox') elements[i].checked = !elements[i].checked;

『陸』 js的全選反選(兩組復選框)

jquery 兩行搞定
$("input[name='a[]']").attr('checked', true); 所有name為a[]的都專選中屬
$("input[name='b[]']").attr('checked', false); 所有name為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()"/>全選專屬/取消

『捌』 js做了個簡單的全選 取消全選 與反選出現了小問題求大佬解答！

您好你這個代碼除了一點問題是因為，你再判斷下方的賦值邏輯是錯的專

你可以把

if(aCh[i].checked==true)

{

aCh[i].checked=false;

}

else

{

aCh[i].checked=true;

}

這里改好就行屬了，記住在判斷後是要賦值的，不要對比了再對比

『玖』 用js 實現一個checkbox同時能全選和取消的功能

貼一個自己的代碼供你參考：

<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Title</title>
<scripttype="text/javascript">
window.onload=function(){
function$(id){
returndocument.getElementById(id);
}
varinputArr=document.getElementById("myCBox").getElementsByTagName("input");
functionsel(flag){
for(vari=0;i<inputArr.length;i++){
inputArr[i].checked=flag;
}
}
//全選
$("selAll").onclick=function(){
sel(true);
}
//取消選擇
$("cancelSel").onclick=function(){
sel(false);
}
//反選
$("invertSel").onclick=function(){
for(vari=0;i<inputArr.length;i++){
inputArr[i].checked=!inputArr[i].checked;
}
}
}
</script>
</head>
<body>

<buttonid="selAll">全選</button><buttonid="cancelSel">取消全選</button><buttonid="invertSel">反選</button>
<divid="myCBox">
<div><inputtype="checkbox">測試1</div>
<div><inputtype="checkbox">測試2</div>
<div><inputtype="checkbox">測試3</div>
<div><inputtype="checkbox">測試4</div>
<div><inputtype="checkbox">測試5</div>
<div><inputtype="checkbox">測試6</div>

</div>
</body>
</html>

運行效果：

『拾』 js全選反選的問題

<script>
function SelectAll() {
var checkboxs=document.getElementsByName("checkboxid");
for (var i=0;i<checkboxs.length;i++) {
var e=checkboxs[i];
e.checked=!e.checked;
}
}
</script>
<a href="#" onclick="SelectAll()">全選/反選</a>
<form name="checkboxform">
<input type="checkbox" name="checkboxid" id="checkboxid" value="<%=rst("fo_id")%>" />
</form>

閱讀全文

與js購物車全選和反選相關的內容

本站內容整理源於互聯網，如有問題請聯系解決。
Copyright design: www.9igoo.com since 2014