发表于: sitebuild | 作者: | 日期: 2009/6/25 11:06

JavaScript操作checkbox在开发中比较常见,例如可以用来检查checkbox项目是否一个都没有选中,如果都没有被选中的话则不能进行表单提交。

假设页面中有如下的checkbox选项:

北京
上海
深圳

1、获取被选中的checkbox的value:

var checkboxObj = document.getElementsByName(“city”);
for(var i = 0; i < checkboxObj.length; i++){ if(checkboxObj[i].checked){ alert(checkboxObj[i].value + " 被选中"); } }

说明
在HTML里面只要NAME属性的值一样就默认是数组,可以直接引用。

2、获取被选中的checkbox的text:

var checkboxObj = document.getElementsByName(“city”);
for(var i = 0; i < checkboxObj.length; i++){ if(checkboxObj[i].checked){ alert(checkboxObj[i].nextSibling.nodeValue); } }

说明:
nextSibling 属性可返回某个元素之后紧跟的元素(处于同一树层级中)。
详细介绍见:http://www.w3school.com.cn/xmldom/prop_node_nextsibling.asp

nodeValue属性可根据节点的类型来设置或返回某个节点的值。
详细介绍见:http://www.w3school.com.cn/xmldom/prop_document_nodevalue.asp

3、创建checkbox
(1)首先我们需要一个容器:

(2)接下来就可以创建checkbox了:

function createChk(){
var divObj = document.getElementById(“dd”);
divObj.insertAdjacentHTML(“beforeEnd”,”昆明”);
}

说明
insertAdjacentHTML用来在指定的地方插入html内容和文本内容。详细介绍见:
http://www.blogjava.net/Scott/archive/2007/08/30/141449.html

4、如何从服务端获取checkbox

对于Java程序而言,在服务端可以通过如下语句获取选中的checkbox的value值:

String[] cities = request.getParameterValues(“city”);
for(int i = 0; i < cities.length; i++){ System.out.println(cities[i]); }

参考链接:
http://topic.csdn.net/t/20060308/23/4601923.html

: https://blog.darkmi.com/2009/06/25/877.html

本文相关评论 - 才一条评论
2011-02-26 08:11:18

[…] 1、checkbox操作 […]

Sorry, the comment form is closed at this time.