js checkbox全选并将获取值放到input里边

更新时间：2009年12月15日 17:53:06 作者：

用js实现获取值传到input里边。

<!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=gb2312" /> <title>无标题文档</title> <script language=Javascript> var tem = ""; function checkAll(e,itemName,thisvalue) { tem= document.getElementById("arrayid").value; var aa=document.getElementsByName(itemName); var bb=document.getElementById('arrayid'); if(e.checked==true){ tem += thisvalue+","; } else{ tem = tem.replace(thisvalue+",",""); } bb.value=tem; for (var i=0; i<aa.length; i++) aa[i].checked = e.checked; } </script> </head> <body> <form id="form1" name="form1" method="post" action=""> <input type="checkbox" name="1001" id="1001" value="1001" onclick="checkAll(this,'mk1001','1001')" checked="checked" /> <label for="1000">复选1</label> <input name="mk1001" type="checkbox" id="mk1001" value="1" checked="checked" /> <input name="mk1001" type="checkbox" id="mk" value="2" checked="checked" /> <input name="mk1001" type="checkbox" id="mk2" value="3" checked="checked"/> <input name="mk1001" type="checkbox" id="mk3" value="4" checked="checked"/> <input name="mk1001" type="checkbox" id="mk4" value="5" checked="checked"/> <input name="mk1001" type="checkbox" id="mk5" value="6" checked="checked"/> <input name="mk1001" type="checkbox" id="mk6" value="7" checked="checked"/> <br> <input type="checkbox" name="1002" id="1002" value="1002" onclick="checkAll(this,'mk1002','1002')" /> <label for="1002">复选2</label> <input name="mk1002" type="checkbox" id="mk7" value="1" /> <input name="mk1002" type="checkbox" id="mk8" value="2" /> <input name="mk1002" type="checkbox" id="mk9" value="3" /> <input name="mk1002" type="checkbox" id="mk10" value="4" /> <input name="mk1002" type="checkbox" id="mk11" value="5" /> <input name="mk1002" type="checkbox" id="mk12" value="6" /> <input name="mk1002" type="checkbox" id="mk13" value="7" /> <br> <input type="checkbox" name="1003" id="1003" value="1003" onclick="checkAll(this,'mk1003','1003')" /> <label for="1003">复选3</label> <input name="mk1003" type="checkbox" id="mk14" value="1" /> <input name="mk1003" type="checkbox" id="mk15" value="2" /> <input name="mk1003" type="checkbox" id="mk16" value="3" /> <input name="mk1003" type="checkbox" id="mk17" value="4" /> <input name="mk1003" type="checkbox" id="mk18" value="5" /> <input name="mk1003" type="checkbox" id="mk19" value="6" /> <input name="mk1003" type="checkbox" id="mk20" value="7" /> <br> <input type="checkbox" name="1004" id="1004" value="1004" onclick="checkAll(this,'mk1004','1004')" /> <label for="1004">复选4</label> <input name="mk1004" type="checkbox" id="mk21" value="1" /> <input name="mk1004" type="checkbox" id="mk22" value="2" /> <input name="mk1004" type="checkbox" id="mk23" value="3" /> <input name="mk1004" type="checkbox" id="mk24" value="4" /> <input name="mk1004" type="checkbox" id="mk25" value="5" /> <input name="mk1004" type="checkbox" id="mk26" value="6" /> <input name="mk1004" type="checkbox" id="mk27" value="7" /> <br> 请把复选1、复选2、复选3、复选4的值传到下面文本框中，中间以","分隔。<br> <input name="arrayid" type="text" id="arrayid" size="30" value="1001," /> <br> </form> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

select下拉选择框美化实现代码(js+css+图片)
图片+JavaScript+CSS三者共同打造超漂亮的select下拉选择框，更看重外观的朋友将会对本代码非常喜欢。
2010-03-03
用于判断用户注册时，密码强度的JS代码
原理及是根据输入字符的类别，是字母，还是数字，大小写等判断，代码比较精简，大家可以研究下。
2009-01-01
Javascript操作select方法大全[新增、修改、删除、选中、清空、判断存在等]
Javascript 操作select控件大全（新增、修改、删除、选中、清空、判断存在等）
2008-09-09
javascript之dhDataGrid Ver2.0.0代码
javascript之dhDataGrid Ver2.0.0代码...
2007-07-07
javascript下给元素添加事件的方法与代码
javascript下给元素添加事件的方法与代码...
2007-08-08
js实现的的文字自动''到google search框
js实现的的文字自动''到google search框...
2007-05-05
取得input元素中部分选中(selected)的值
取得input元素中部分选中(selected)的值...
2007-02-02
select列表内容交换的js实现代码
js实现左右select列表内容交换传递，原来就是先获取当期选中select的值，然后添加到对面的select中，然后删除选中内容。
2009-12-12
文本框点击时文字消失，失去焦点时文字出现
这个功能主要用户搜索关键字框中，提示用户输入关键字，代码清晰，比原理的功能要好很多，推荐使用
2008-09-09
改进版：在select中添加、修改、删除option元素
改进版：在select中添加、修改、删除option元素...
2006-10-10

js checkbox全选并将获取值放到input里边

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具