Discuz x2 checkbox 全选或取消代码演示 (568)
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里面。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
/* 飞龙提示： 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也可以。
|
1 |
<script type="text/javascript" src="./static/js/common.js"></script> |
其次看看html部分，需要一个form表单，需要用数组变量名，全选按钮要有id名，全部用字母。
|
1 2 3 4 5 6 7 |
<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文档放这里，方便朋友你直接取用分析。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 |
<!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> |
本文更新网址：https://feilong.org/discuz-checkbox-checkall-uncheckall
2011-08-15 ~ 2011-08-15
加入收藏夹，查看更方便。
分类： 网站开发