BootStrap iCheck插件全選與獲取value值的解決方法
在使用jQuery iCheck 插件的時(shí)候遇到了一個(gè)問題,就是當(dāng)我們使用普通的js全選功能無效了。
$("#checkall").click( function(){ if(this.checked){ $("input[name='checkname']").each(function(){this.checked=true;}); }else{ $("input[name='checkname']").each(function(){this.checked=false;}); } } );
這樣來寫對默認(rèn)的checkbox框沒問題,但是當(dāng)使用iCheck 插件后將無效。
那么該怎么解決呢?
最后是在stackoverflow 找到的解決方法:
地址是這里: http://stackoverflow.com/questions/17820080/function-select-all-and-icheck
//全選獲取數(shù)值 var checkAll = $('input.all'); var checkboxes = $('input.check'); checkAll.on('ifChecked ifUnchecked', function(event) { if (event.type == 'ifChecked') { checkboxes.iCheck('check'); } else { checkboxes.iCheck('uncheck'); } }); checkboxes.on('ifChanged', function(event){ if(checkboxes.filter(':checked').length == checkboxes.length) { checkAll.prop('checked', 'checked'); } else { checkAll.removeProp('checked'); } checkAll.iCheck('update'); });
在解決了全選問題后,又遇到了一個(gè)新的問題,獲取選中的checkbox的value的時(shí)候,使用:$(this).attr('checked');獲取不到值了~,蛋疼。
最后幾經(jīng)Google搜索,還是在stackoverflow 找到了啟發(fā),判斷checkbox的布爾值,使用 :$(this).is(':checked');
最后代碼的解決方法如下:
$(".ajax-delete").click(function(){ var url = $(this).attr('data-url'); var str=""; var ids=""; $("input[name='id']:checkbox").each(function(){ if(true == $(this).is(':checked')){ str+=$(this).val()+","; } }); if(str.substr(str.length-1)== ','){ ids = str.substr(0,str.length-1); } console.log(ids); });
以上所述是小編給大家介紹的BootStrap iCheck插件全選與獲取value值的解決方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
- JS樹形菜單組件Bootstrap TreeView使用方法詳解
- 淺析使用BootStrap TreeView插件實(shí)現(xiàn)靈活配置快遞模板
- Bootstrap樹形菜單插件TreeView.js使用方法詳解
- 淺析BootStrap Treeview的簡單使用
- 基于MVC5和Bootstrap的jQuery TreeView樹形控件(二)之?dāng)?shù)據(jù)支持json字符串、list集合
- 基于MVC5和Bootstrap的jQuery TreeView樹形控件(一)之?dāng)?shù)據(jù)支持json字符串、list集合
- bootstrap-treeview自定義雙擊事件實(shí)現(xiàn)方法
- 利用Bootstrap實(shí)現(xiàn)表格復(fù)選框checkbox全選
- Angularjs+bootstrap+table多選(全選)支持單擊行選中實(shí)現(xiàn)編輯、刪除功能
- bootstrap插件treeview實(shí)現(xiàn)全選父節(jié)點(diǎn)下所有子節(jié)點(diǎn)和反選功能
相關(guān)文章
jquery mobile的觸控點(diǎn)擊事件會多次觸發(fā)問題的解決方法
這篇文章主要介紹了jquery mobile的觸控點(diǎn)擊事件會多次觸發(fā)問題的解決方法以及替代方法,需要的朋友可以參考下2014-05-05jQuery分頁插件jquery.pagination.js使用方法解析
這篇文章主要為大家詳細(xì)解析了jQuery分頁插件jquery.pagination使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02基于jquery實(shí)現(xiàn)ajax無刷新評論
這篇文章主要為大家詳細(xì)介紹了基于jquery實(shí)現(xiàn)ajax無刷新評論的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考2016-05-05jquery中郵箱地址 URL網(wǎng)站地址正則驗(yàn)證實(shí)例代碼
QQ網(wǎng)站有一個(gè)網(wǎng)站舉報(bào)的功能,看了一些js代碼覺得寫得很不錯(cuò),我就拿下來了,下面是一個(gè)email驗(yàn)證與url網(wǎng)址驗(yàn)證js代碼,分享給大家2013-09-09動(dòng)感效果的TAB選項(xiàng)卡jquery 插件
動(dòng)感效果的TAB選項(xiàng)卡jquery 插件,需要的朋友可以參考下。2011-07-07jquery.simple.tree插件 更簡單,兼容性更好的無限樹插件
在這里介紹一款小巧,功能強(qiáng)大,能拖拽,支持異步,且兼容性更高的jquery Tree插件2010-09-09jquery獲取自定義屬性(attr和prop)實(shí)例介紹
jquery中用attr()方法來獲取和設(shè)置元素屬性,attr是attribute(屬性)的縮寫,在jQuery DOM操作中會經(jīng)常用到attr(),attr()有4個(gè)表達(dá)式2013-04-04jquery 正整數(shù)數(shù)字校驗(yàn)正則表達(dá)式
本文主要介紹了jquery正整數(shù)數(shù)字校驗(yàn)正則表達(dá)式的方法。具有一定的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01