Discuz x2 checkbox 全选或取消代码演示
飞龙更新于 2011-08-15 12:02 加入书签 CTRL+D 有 46 个朋友来过Discuz x2 内置一套常用建站js代码,所以做discuz X2开发或网站前端开发,尽量用discuz现有的js成果,但是如何使用discuz官方文档没有演示。这里飞龙简单举例演示一下关于checkbox 全选和取消代码是如何使用的。本日志修订网址:http://feilong.org/discuz-checkbox-checkall-uncheckall 希望对你有用!
补充,需要全选反选飞龙jQuery解决方案的朋友,参见:http://feilong.org/check-uncheck-juery-solution
一、首先调用discuz X2的checkall()方法,在common.js里面。
/* 飞龙提示: form,建议用 this.form prefix, 指提交的 checkbox 数组变量名 checkall, 全选按钮的ID名称 tested by feilong on 20110815 */ function checkall(form, prefix, checkall) { var checkall = checkall ? checkall : 'chkall'; count = 0; for(var i = 0; i < form.elements.length; i++) { var e = form.elements[i]; if(e.name && e.name != checkall && (!prefix || (prefix && e.name.match(prefix)))) { e.checked = form.elements[checkall].checked; if(e.checked) { count++; } } } return count; } |
或者直接外调commo.js也可以。
<script type="text/javascript" src="./static/js/common.js"></script> |
其次看看html部分,需要一个form表单,需要用数组变量名,全选按钮要有id名,全部用字母。
<form action="" method="get||post" id="feilongform" name="flmusics"> <input name="lovemusic[]" id="music1" type="checkbox"> <input name="lovemusic[]" id="music2" type="checkbox"> <input name="lovemusic[]" id="music3" type="checkbox"> <input name="fl" id="chooseall" onclick="checkall(this.form, 'lovemusic', 'chooseall');" type="checkbox"> 全选 </form> |
最后飞龙把整个html文档放这里,方便朋友你直接取用分析。
<!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>Discuz x2 checkbox 全选和取消代码演示</title> <!--js来源:discuz x2 20110531 tested by feilong on 20110815 <script type="text/javascript" src="./static/js/common.js"></script> --> <script type="text/javascript"> /* 飞龙提示: form,建议用 this.form prefix, 指提交的 checkbox 数组变量名 checkall, 全选按钮的ID名称 tested by feilong on 20110815 */ function checkall(form, prefix, checkall) { var checkall = checkall ? checkall : 'chkall'; count = 0; for(var i = 0; i < form.elements.length; i++) { var e = form.elements[i]; if(e.name && e.name != checkall && (!prefix || (prefix && e.name.match(prefix)))) { e.checked = form.elements[checkall].checked; if(e.checked) { count++; } } } return count; } </script> </head> <body> <form action="" method="get||post" id="feilongform" name="flmusics"> <input name="lovemusic[]" id="music1" type="checkbox"> <input name="lovemusic[]" id="music2" type="checkbox"> <input name="lovemusic[]" id="music3" type="checkbox"> <input name="fl" id="chooseall" onclick="checkall(this.form, 'lovemusic', 'chooseall');" type="checkbox"> 全选 </form> </body> </html> |
维护小站,感谢赞赏。
联系飞龙,请转淘宝。
飞龙初发:
2011-08-15 12:02
本文更新网址:
https://feilong.org/discuz-checkbox-checkall-uncheckall
所在目录: 网站开发