快捷導(dǎo)航

JQuery勾選指定name的復(fù)選框集合并顯示的方法

更新時(shí)間：2015年05月18日 11:28:38 作者：永遠(yuǎn)愛好寫程序

這篇文章主要介紹了JQuery勾選指定name的復(fù)選框集合并顯示的方法,涉及jQuery表單元素操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了JQuery勾選指定name的復(fù)選框集合并顯示的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：

<!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></title>
<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
 $("input[name='love']").click(function () {
 //獲得所有name為love的選中的復(fù)選框
 var $Checks = $("input[name='love']:checked");
 var arr = new Array();
 //使用了元素的each方法
 //循環(huán)Jquery對象里的dom數(shù)組
 $Checks.each(function (index, value) {
  //alert(value);
  arr[index] = value.value;
 });
 $("#MessageInfo").text("你選擇了"+arr.length+"個(gè)愛好,"+arr.join(","));
 });
});
</script>
</head>
<body>
<input type="checkbox" name="love" value="FootBall" />足球
<input type="checkbox" name="love" value="BasketBall" />籃球
<input type="checkbox" name="love" value="VallyBall" />排球
<p id="MessageInfo"></p>
</body>
</html>

希望本文所述對大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

基于jquery的web頁面日期格式化插件
基于jquery的web頁面日期格式化插件，需要的朋友可以參考下。
2011-11-11
jQuery應(yīng)用之jQuery鏈用法實(shí)例
這篇文章主要介紹了jQuery應(yīng)用之jQuery鏈用法,實(shí)例形式分析了jQuery鏈的原理及使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-01-01
jQuery移動(dòng)端跑馬燈抽獎(jiǎng)特效升級版(抽獎(jiǎng)概率固定)實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery移動(dòng)端跑馬燈抽獎(jiǎng)特效升級版(抽獎(jiǎng)概率固定)實(shí)現(xiàn)方法,涉及jQuery數(shù)值運(yùn)算及條件判斷等相關(guān)操作技巧,需要的朋友可以參考下
2019-01-01
jquery prop的使用介紹及與attr的區(qū)別
Prop和attr的作用類似，相同點(diǎn)：兩者都可以獲取屬性值和設(shè)置屬性值，下面為大家介紹下具體的使用
2013-12-12
div模擬選擇框示例代碼
這次項(xiàng)目就有這個(gè)要求了，模擬選項(xiàng)框，我選擇使用div+css+jquery來實(shí)現(xiàn)，總的來說還不錯(cuò)，感興趣的朋友可以參考下
2013-11-11
jquery canvas生成帶有二維碼的海報(bào)
這篇文章主要為大家詳細(xì)介紹了jquery canvas生成帶有二維碼的海報(bào)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-10-10
基于jQuery實(shí)現(xiàn)的仿百度首頁滑動(dòng)選項(xiàng)卡效果代碼
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)的仿百度首頁滑動(dòng)選項(xiàng)卡效果代碼,涉及jQuery響應(yīng)鼠標(biāo)事件實(shí)現(xiàn)頁面元素動(dòng)態(tài)變換的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-11-11
jQuery刪除節(jié)點(diǎn)的三個(gè)方法即remove()detach()和empty()
jQuery提供了三種刪除節(jié)點(diǎn)的方法，即remove()，detach()和empty()，下面為大家詳細(xì)介紹下jQuery刪除節(jié)點(diǎn)三個(gè)方法的具體使用
2013-12-12
40個(gè)有創(chuàng)意的jQuery圖片和內(nèi)容滑動(dòng)及彈出插件收藏集之三
在網(wǎng)頁的首頁或圖片專題頁面很多地方都會(huì)用到圖片滑動(dòng)插件來循環(huán)切換多張圖片，并且用戶可以點(diǎn)擊左右按鈕來切換圖片。
2012-01-01
jquery統(tǒng)計(jì)用戶選中的復(fù)選框的個(gè)數(shù)
使用選擇器得到所有被勾選的復(fù)選框元素的集合，然后通過判斷元素的個(gè)數(shù)來得到用戶勾選的個(gè)數(shù),需要的朋友可以參考下
2014-06-06