<div class="codetitle"> <span><a style="CURSOR: pointer" data="80236" class="copybut" id="copybut80236" onclick="doCopy('code80236')"><u>複製程式碼</u></a></span>如下程式碼：</div> <div class="codebody" id="code80236"> <br>場//EN" "http://www.w3.org/TR/html4/loose.dtd"> <br> <br> <br><style><!-- <br><br>--></style> <style mce_bogus="1"> <br><br></風格> <BR><title>JS取得表單被選取的值; <BR></頭> <BR><身體> <BR><輸入類型=“checkbox”名稱=“測試”值=“0”/>0 <BR><輸入類型=“複選框”名稱= “測試”值=“1”/>1 <BR><input type="checkbox" name="test" value="2" />2 <BR><input type="checkbox" name="test" value ="3" />3 <BR><輸入類型=“複選框”名稱=“測試”值=“4”/>4 <BR><輸入類型=“複選框”名稱=“測試”值=“5”/>5 <BR><輸入類型=“複選框”名稱=“測試”值=“6”/>6 <BR><輸入類型=“複選框”名稱=“測試”值=“7”/>7 <BR><input type="button" onclick="chk()" value="提交" />> <BR></身體> <BR><BR></style> </div> <br>JS程式碼<br><div class="codetitle"> <span><a style="CURSOR: pointer" data="71950" class="copybut" id="copybut71950" onclick="doCopy('code71950')"><u>複製程式碼</u></a></span>程式碼如下：</div> <div class="codebody" id="code71950"> <br><script src="jquery.js" mce_src="jquery.js"></script><!--正在載入jquery.js文件，如果沒有使用jquery可以去掉--> <br><script type="text /javascript"><!-- <br><br>function chk(){ <BR>var obj=document.getElementsByName('test'); //選擇所有name="'test'"的對象，返回緩存<BR>//取到快取物件後，我們來循環偵測它是不是被選取<BR>var s=''; <BR>for(var i=0; i<obj.length; i ){ <BR>if(obj[i].checked) s =obj[i].value ','; //如果選中，將值加到變數中<BR>} <BR>//那麼現在來偵測的值就知道表單的值了<BR>alert(s==''?'你還沒選任何內容了！ ':s); <BR>} <br><br>function jqchk(){ //jquery取得表單值<BR>var chk_value =[]; <BR>$('input[name="test"]: checked').each(function(){ <BR>chk_value.push($(this).val()); <BR>}); <BR>alert(chk_value.length==0 ?'你還沒選擇任何內容！全選<BR>2。 取消全選 <BR>3. 選取所有奇數 <BR>4。 反選</div>5. 取得選取的所有值<BR><br>js程式碼<br><BR><BR><BR><BR>複製程式碼<br><br><BR><div class="codetitle">複製程式碼<span><a style="CURSOR: pointer" data="49924" class="copybut" id="copybut49924" onclick="doCopy('code49924')"><U></U>複製碼></a> </span>$("document").ready(function(){ </div>$("#btn1").click(function(){ <div class="codebody" id="code49924">$("[name='checkbox'] ").attr(" check",'true');//全選<BR>}) <BR>$("#btn2").click(function(){ <BR>$("[name=' checkbox']"). removeAttr("checked");//取消全選<BR>}) <BR>$("#btn3").click(function(){ <BR>$("[name=' checkbox']:even" ).attr("checked",'true');//選取所有奇數<BR>}) <BR>$("#btn4").click(function(){ <BR>$ ("[name=' checkbox']").each(function(){//反選<BR>if($(this).attr("checked")){ <BR>$(this).removeAttr(" checked"); <BR>} <BR>else{ <BR>$(this).attr("checked",'true'); <BR>} <BR>}) <BR>}) <BR>$ ("#btn5"); .click(function(){//編輯選取的值<BR>var str=""; <BR>$("[name='checkbox'][checked]").each( function(){ <BR> str =$(this).val() "/r/n" <BR>//alert($(this).val()); <BR>alert(str); }) <BR>}) <BR><BR> <BR>html程式碼：<BR><BR><BR></div><BR>複製程式碼<BR><div class="codetitle"><span>程式碼<div class="codebody" id="code89445"> <BR><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > <BR><html xmlns="http://www.w3.org/1999/xhtml"> <BR><頭> <BR><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />> <BR><標題>路易斯部落格>> jQuery 對複選框的操作</title> <BR><mce:script type='text/javascript' src="http:/ /leotheme.cn/wp-includes/js/jquery/jquery.js" mce_src="http://leotheme.cn/wp -includes/js/jquery/jquery.js"></mce:script> <BR> <腳本語言=“JavaScript”> <BR><!-- <BR>$("document").ready(function(){ <BR>$("#btn1").click(function(){ <BR>$("[name= 'checkbox']").attr("checked",'true');//全選<BR>}) <BR>$("#btn2").click(function() { <BR>$(" [name='checkbox']").removeAttr("checked");//取消全選<BR>}) <BR>$("#btn3").click(function() { <BR>$(" [name='checkbox']:even").attr("checked",'true');//選取所有奇數<BR>}) <BR>$("#btn4") .click(function(){ <BR>$("[name='checkbox']").each(function(){//反選<BR>if($(this).attr("checked")){ <BR>$(this) .removeAttr("已檢查"); <BR>} <BR>else{ <BR>$(this).attr("已檢查",'true'); <BR>} <BR>}) <BR>}) <BR>$("#btn5").click(function(){//編輯選取的值<BR>var str=""; <BR>$("[name= 'checkbox'][checked]") .each(function(){ <BR>str =$(this).val() "/r/n"; <BR>//alert($(this).val( )); <BR>}) <BR>警報(str); <BR>}) <BR>}) <BR>--> <br> <br> <br> <br><div style="border: 1pxsolid #999; 寬度: 500px; padding: 15px; 背景: #eee; margin-top: 150px;"> <br> <br><input type="button" id="btn1" value="全選"> <br><input type="button" id="btn2" value="取消全選"> <br><input type="button" id="btn3" value="選取的所有奇數"> <br><input type="button" id="btn4" value="反選"> <br><input type="button" id="btn5" value="取得所有選取的值"> <br><br><br>> <br> <br>checkbox1 <br><input type="checkbox" name="checkbox" value="checkbox2"> <br>checkbox2 <br><input type="checkbox" name="checkbox" value="checkbox3"> <br>checkbox3 <br><input type="checkbox" name="checkbox" value="checkbox4"> <br>checkbox4 <br><input type="checkbox" name="checkbox" value4><input type="checkbox" name="checkbox" value="checkbox5"> <br>checkbox5 <br><input type="checkbox" name="checkbox" value="checkbox6"> <br>checkbox6 <br> <br> </div> <br> 身體> <br></script> </div>
