 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>jQuery中的val()</title> 
<script type="text/javascript" src="jquery-2.1.0.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$("#btn").click(function(){ 
$("input[name=ckb]:checked").each(function() { 
alert($(this).val()); 
}); 
}); 

}); 
</script> 
</head> 

<body> 
<div id="div1"> 
<table> 
<tr> 
<td> 
<input type="checkbox" id="ckb1" name="ckb" value="籃球"/>籃球 
<input type="checkbox" id="ckb2" name="ckb" value="足球"/>足球 
<input type="checkbox" id="ckb3" name="ckb" value="排球"/>排球 
</td> 
</tr> 
<tr> 
<td> 
<input type="button" id="btn" value="取值"/> 
</td> 
</tr> 
</table> 
</div> 
</body> 
</html> 

2、結(jié)果如下

（1）選中所有的

依次彈出“籃球、足球和排球”

（2）選中部分

依次彈出相應(yīng)的值

（3）全不選

不彈窗口

您可能感興趣的文章:

jQuery
val()

相關(guān)文章

Jquery UI震動(dòng)效果實(shí)現(xiàn)原理及步驟
如果你想你的博客頁(yè)面某些部分引起讀者的注意，你可以使這些部分震動(dòng)，如廣告等等，今天這篇文章將介紹怎樣使你的頁(yè)面中的元素震動(dòng)起來(lái),感興趣的你可不要錯(cuò)過(guò)了哦，或許對(duì)你學(xué)習(xí)jquery ui 有所幫助
2013-02-02
教你用jquery實(shí)現(xiàn)iframe自適應(yīng)高度
iframe因?yàn)槟芎途W(wǎng)頁(yè)無(wú)縫的結(jié)合從而不刷新頁(yè)面的情況下更新頁(yè)面的部分?jǐn)?shù)據(jù)成為可能，可是 iframe的大小卻不像層那樣可以“伸縮自如”，所以帶來(lái)了使用上的麻煩，給iframe設(shè)置高度的時(shí)候多了也不好，少了更是不行，今天我們就來(lái)分享2種使用jquery實(shí)現(xiàn)iframe自適應(yīng)高度的代碼
2014-06-06
servlet+jquery實(shí)現(xiàn)文件上傳進(jìn)度條示例代碼
現(xiàn)在文件的上傳，特別是大文件上傳，都需要進(jìn)度條。這篇文章主要介紹了servlet+jquery實(shí)現(xiàn)文件上傳進(jìn)度條示例代碼，有興趣的可以了解一下。
2017-01-01
jquery 合并內(nèi)容相同的單元格(示例代碼)
這篇文章主要是對(duì)jquery合并內(nèi)容相同的單元格示例代碼進(jìn)行了介紹。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-12-12
jQuery+Ajax實(shí)現(xiàn)限制查詢間隔的方法
這篇文章主要介紹了jQuery+Ajax實(shí)現(xiàn)限制查詢間隔的方法,涉及jQuery的ajax方法參數(shù)設(shè)置及asp.net后臺(tái)交互的相關(guān)技巧,需要的朋友可以參考下
2016-06-06
jQuery+ajax實(shí)現(xiàn)鼠標(biāo)單擊修改內(nèi)容的方法
這篇文章主要介紹了jQuery+ajax實(shí)現(xiàn)鼠標(biāo)單擊修改內(nèi)容的方法,需要的朋友可以參考下
2014-06-06
Jquery AutoComplete自動(dòng)完成的使用方法實(shí)例
jQuery的Autocomplete（自動(dòng)完成、自動(dòng)填充）插件有不少，但比較下來(lái)我感覺(jué)，還是bassistance.de的JQuery Autocomplete plugin比較強(qiáng)大，我們就來(lái)寫一些代碼感受一下。
2010-03-03
jquery實(shí)現(xiàn)類似淘寶星星評(píng)分功能有截圖
本節(jié)主要介紹了jquery實(shí)現(xiàn)類似淘寶星星評(píng)分功能，經(jīng)測(cè)試效果相當(dāng)不錯(cuò)，有圖有真相，喜歡的朋友可以參考下
2014-09-09
基于Jquery 好友選擇器V2.0
之前發(fā)布過(guò)一片文章：自己動(dòng)手做jquery 好友輸入提示插件 ,現(xiàn)在這次發(fā)布的是增強(qiáng)版，在功能和用戶體驗(yàn)等方面多做了改善和拓展。
2009-05-05
jQuery實(shí)現(xiàn)帶進(jìn)度條的輪播圖
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)帶進(jìn)度條的輪播圖，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-09-09