js實現復選框的操作-------Day41

不知道之前的一篇為什么一直處於審核階段。難道有哪個詞語是敏感詞被河蟹了？

無論了，又一次寫了這篇，也算是加深記憶吧。

首先要寫的是今天在進行表格數據操作時用到的對復選框checkbox的全選和全不選，首先來編寫下html語言

<table>
    	<thead>
	    	<tr>
	    		<td><input type="checkbox" id="sall" onchange="changeAll()"></td>
	    	</tr>
    	</thead>
    	<tbody>
	    	<tr>
	    		<td><input type="checkbox" name="each" value="1"></td>
	    	</tr>
	    	<tr>
	    		<td><input type="checkbox" name="each" value="2"></td>
	    	</tr>
	    	<tr>
	    		<td><input type="checkbox" name="each" value="3"></td>
	    	</tr>
	    	<tr>
	    		<td><input type="checkbox" name="each" value="4"></td>
	    	</tr>
    	</tbody>
    </table>

來寫一下從網上搜羅后終於實現的比較簡單明了的寫法。比自己寫的好了不止一倍啊

function changeAll(){
		var sall=document.getElementById("sall");//獲取標題欄中的操作對象
		var seach=document.getElementsByName("each");//獲取內容欄的對象
		for(var i=0;i<seach.length;i++){
			if (sall.checked) {
				seach[i].checked=true;
			}else{
				seach[i].checked=false;
			}
		}
	}

來分析下它的實現方法，比自己寫的果斷要好了不少，自己當時採取了兩種方法，可是遠不如這個成型的簡單介紹明了。自己的全用id來操作確實又臭又長了。

對復選框的操作還有比較常見的復選框。就上面這個樣例來的話。我們來實現下：onchange="change()"

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

最后。對復選框的最經常使用的就是獲取某一列的信息，從而實現傳值。這里我們來獲取下值：

var seach=document.getElementsByName("each");
for(var i=0;i<seach.length;i++){
if(seach[i].checked){
alert(seach[i].value);

}
}

不知道自己到底堅持的是什么了。這樣又一次編寫一遍的話，效果上來說，實在沒有第一遍來的那么好。無論那么多了，加油吧，菜鳥飛飛飛....