jQuery多選框選擇數(shù)量限制方法
在網(wǎng)上找到的,可以使用。由于刷新后,多選框會(huì)保留選中的,這時(shí)數(shù)量達(dá)到要求后還是可以選擇的bug,在前面加個(gè)判斷數(shù)量是否數(shù)量達(dá)到要求的處理就可以了。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無(wú)標(biāo)題文檔</title> <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> <script> $(function(){ //加上判斷是否達(dá)到數(shù)量要求 if($(":checkbox").size()>=3){ $(":checkbox").removeAttr("checked"); $(":checkbox").attr("disabled","disabled"); $(":checkbox").removeAttr("disabled"); } var num = 0; $(":checkbox").each(function(){ $(this).click(function(){ if($(this)[0].checked) { ++num; if(num == 3) { //alert("最多選擇 三項(xiàng) 的上限已滿(mǎn), 其他選項(xiàng)將會(huì)變?yōu)椴豢蛇x."); $(":checkbox").each(function(){ if(!$(this)[0].checked) { $(this).attr("disabled", "disabled"); } }); } } else { --num; if(num <= 2) { $(":checkbox").each(function(){ if(!$(this)[0].checked) { $(this).removeAttr("disabled"); } }); } } }); }); }) </script> </head> <body> <input type="checkbox" />上網(wǎng)<br /> <input type="checkbox" />旅游<br /> <input type="checkbox" />逛街<br /> <input type="checkbox" />游戲<br /> <input type="checkbox" />聽(tīng)歌<br /> <input type="checkbox" />購(gòu)物<br /> </body> </html>
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- jQuery 獲取多選框的值及多選框中文的函數(shù)
- jQuery實(shí)現(xiàn)的多選框多級(jí)聯(lián)動(dòng)插件
- jquery select多選框的左右移動(dòng) 具體實(shí)現(xiàn)代碼
- jquery對(duì)單選框,多選框,文本框等常見(jiàn)操作小結(jié)
- 簡(jiǎn)單實(shí)現(xiàn)jQuery多選框功能
- jQuery對(duì)下拉框,單選框,多選框的操作
- jquery中表單 多選框的一種巧妙寫(xiě)法
- jQuery模擬html下拉多選框的原生實(shí)現(xiàn)方法示例
- Jquery多選框互相內(nèi)容交換的實(shí)例代碼
- jQuery中實(shí)現(xiàn)prop()函數(shù)控制多選框(全選,反選)
- jQuery實(shí)現(xiàn)獲取多選框的值示例
相關(guān)文章
jQuery動(dòng)畫(huà)顯示和隱藏效果實(shí)例演示(附demo源碼下載)
這篇文章主要介紹了jQuery動(dòng)畫(huà)顯示和隱藏效果實(shí)現(xiàn)方法,并附帶了demo源碼供讀者下載參考,涉及jQuery操作圖片的顯示,隱藏及淡入淡出等效果,需要的朋友可以參考下2015-12-12深入學(xué)習(xí)jQuery Validate表單驗(yàn)證
這篇文章主要針對(duì)jQuery Validate表單驗(yàn)證為大家進(jìn)行詳細(xì)介紹,如何在class屬性里面并定義錯(cuò)誤信息的提示,感興趣的小伙伴們可以參考一下2016-01-01JQuery+Bootstrap 自定義全屏Loading插件的示例demo
這篇文章主要介紹了JQuery+Bootstrap 自定義全屏Loading插件,本文通過(guò)示例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-07-07jQuery實(shí)現(xiàn)百度登錄框的動(dòng)態(tài)切換效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)百度登錄框的動(dòng)態(tài)切換效果,需要的朋友可以參考下2017-04-04JQuery給select添加/刪除節(jié)點(diǎn)的實(shí)現(xiàn)代碼
下面小編就為大家?guī)?lái)一篇JQuery給select添加/刪除節(jié)點(diǎn)的實(shí)現(xiàn)代碼。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考2016-04-04使用jQuery模板來(lái)展現(xiàn)json數(shù)據(jù)的代碼
通常我們?cè)谑褂胊jax的時(shí)候,都避免不了和json這種輕巧的數(shù)據(jù)格式打交道??墒峭謩?dòng)的去解析json,構(gòu)建HTML,比較麻煩?,F(xiàn)在有了這個(gè)插件,就能像Extjs那樣使用模板解析json了。2010-10-10jquery移除button的inline onclick事件(已測(cè)試及兼容瀏覽器)
這種方法在Google Chrome下正常工作,但是在IE的兼容模式下會(huì)馬上調(diào)用reclick方法,這不是我們想要的效果;為了解決這個(gè)問(wèn)題,我們可以換個(gè)思路,就是延遲綁定click事件2013-01-01jquery實(shí)現(xiàn)手風(fēng)琴效果實(shí)例代碼
這篇文章介紹了jquery實(shí)現(xiàn)手風(fēng)琴效果實(shí)例代碼,有需要的朋友可以參考一下2013-11-11