在js中怎样获得checkbox里选中的多个值?

 我来答
小澈Wataru
推荐于2019-09-28 · TA获得超过3240个赞
知道答主
回答量:73
采纳率:0%
帮助的人:4万
展开全部

举个例子,比如如下是HTML的结构:

这里推荐使用jQuery库,比较方便。以下是代码:

大致思路就是:先利用name属性值获取checkbox对象,然后循环判断checked属性。(true表示被选中,false表示未选中)

具体解释一下:

首先用document.getElementsByName()这个方法,通过input标签的name属性将input元素获取,并存进obj这个变量值中。然后建一个check_val的数组,通过for循环将input标签的value值存入数组中,这样就可以获取checkbox的选中的多个值。

扩展资料:

Checkbox 对象代表一个 HTML 表单中的 一个选择框。

在 HTML 文档中 <input type="checkbox"> 每出现一次,Checkbox 对象就会被创建。

您可以通过遍历表单的 elements[] 数组来访问某个选择框,或者通过使用 document.getElementById() 。

参考资料:MDN—关于CheckBox属性

南北186
推荐于2019-10-20 · TA获得超过9.1万个赞
知道小有建树答主
回答量:114
采纳率:100%
帮助的人:5.3万
展开全部

利用name属性值获取checkbox对象,然后循环判断checked属性,true表示被选中,false表示未选中。

1、HTML结构:

2、javascript代码:

3、演示效果:

扩展资料:

js获得多个checkbox选中的值的方法:

一、代码如下:

二、后台获得参数为:

//获得的均为数组值:

String checboxValues=request.getParameter("checboxValue")。

String checboxTexts=request.getParameter("checboxText")。

//得到每个具体值:

String checboxValue=checboxValues.split(",")。

String checboxText=checboxTexts.split(",")。

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
树木爱水闰
推荐于2019-10-07 · TA获得超过3.7万个赞
知道小有建树答主
回答量:40
采纳率:90%
帮助的人:1万
展开全部

一、方法:利用name属性值获取checkbox对象,然后循环判断checked属性(true表示被选中,false表示未选中)。下面进行实例演示:

1、HTML结构

<input type="checkbox" name="test" value="1"/><span>1</span><input type="checkbox" name="test" value="2"/><span>2</span><input type="checkbox" name="test" value="3"/><span>3</span><input type="checkbox" name="test" value="4"/><span>4</span><input type="checkbox" name="test" value="5"/><span>5</span><input type='button' value='提交' onclick="show()"/>

2、javascript代码(jQuery)

function show(){
    obj = document.getElementsByName("test");
    check_val = [];
    for(k in obj){
        if(obj[k].checked)
            check_val.push(obj[k].value);
    }
    alert(check_val);
}

3、演示效果

二、什么是JS

1、JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

2、在1995年时,由Netscape公司的Brendan Eich,在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。

3、为了取得技术优势,微软推出了JScript,CEnvi推出ScriptEase,与JavaScript同样可在浏览器上运行。为了统一规格,因为JavaScript兼容于ECMA标准,因此也称为ECMAScript。

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
learneroner
高粉答主

推荐于2017-10-10 · 关注我不会让你失望
知道大有可为答主
回答量:1.1万
采纳率:91%
帮助的人:6478万
展开全部

思路:利用name属性值获取checkbox对象,然后循环判断checked属性(true表示被选中,false表示未选中)。下面进行实例演示:

1、HTML结构

<input type="checkbox" name="test" value="1"/><span>1</span>
<input type="checkbox" name="test" value="2"/><span>2</span>
<input type="checkbox" name="test" value="3"/><span>3</span>
<input type="checkbox" name="test" value="4"/><span>4</span>
<input type="checkbox" name="test" value="5"/><span>5</span><br>
<input type='button' value='提交' onclick="fun()"/>

2、javascript代码

function fun(){
obj = document.getElementsByName("test");
check_val = [];
for(k in obj){
if(obj[k].checked)
check_val.push(obj[k].value);
}
alert(check_val);
}

3、演示效果

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
徐临祥
高粉答主

2019-12-23 · 醉心答题,欢迎关注
知道小有建树答主
回答量:3380
采纳率:96%
帮助的人:90.7万
展开全部
1.新建一个html文件,命名为test.html,用于实现统计多选项被选中的个数。
2.在test.html中,创建一个form表单,在表单内定义四个类型为checkbox的input元素,实现多选项。
3.在form表单内,再创建一个button按钮,用于点击计算多选项已选中的个数。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(8)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式