JavaScript简单判断复选框是否选中及取出值的方法


Posted in Javascript onAugust 13, 2015

本文实例讲述了JavaScript简单判断复选框是否选中及取出值的方法。分享给大家供大家参考。具体如下:

这里使用JavaScript 获取复选框的值,有朋友在刚开始利用表单提交数据的时候,一般都会遇到表单中有一个特别的元素——复选框,判断它是否选中以及获取它的值 ,好像跟其它的表单元素有点不一样,本代码将为您展示如何获取复选框的值并判断是否被选中。

运行效果如下图所示:

JavaScript简单判断复选框是否选中及取出值的方法

具体代码如下:

<title>JavaScript 获取复选框的值</title>
<script>
function checkbox()
{
var str=document.getElementsByName("box");
var objarray=str.length;
var chestr="";
for (i=0;i<objarray;i++)
{
 if(str[i].checked == true)
 {
  chestr+=str[i].value+",";
 }
}
if(chestr == "")
{
 alert("请先选择复选框~!");
}
else
{
 alert("复选框的值是:"+chestr);
}
}
</script>
选择您的拿手技术:
<input type="checkbox" name="box" id="box1" value="ASP" />ASP
<input type="checkbox" name="box" id="box2" value="PHP" />PHP
<input type="checkbox" name="box" id="box3" value="JSP" />JSP
<input type="button" name="button" id="button" onclick="checkbox()" value="提交" />

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
prototype class详解
Sep 07 Javascript
一个背景云变换js特效 鼠标移动背景云变化
Dec 28 Javascript
javascript正则匹配汉字、数字、字母、下划线
Apr 10 Javascript
jQuery焦点图轮播效果实现方法
Dec 19 Javascript
JavaScript数据结构之链表的实现
Mar 19 Javascript
vue微信分享到朋友圈 vue微信发送给好友
Nov 28 Javascript
在node中使用jwt签发与验证token的方法
Apr 03 Javascript
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 jQuery
JavaScript面向对象中接口实现方法详解
Jul 24 Javascript
vue实现路由不变的情况下,刷新页面操作示例
Feb 02 Javascript
Vue使用Proxy代理后仍无法生效的解决
Nov 13 Javascript
Vue.js中v-bind指令的用法介绍
Mar 13 Vue.js
JavaScript实现将文本框的值插入指定位置的方法
Aug 13 #Javascript
JavaScript的jQuery库中function的存在和参数问题
Aug 13 #Javascript
js实现仿Discuz文本框弹出层效果
Aug 13 #Javascript
深入学习JavaScript中的原型prototype
Aug 13 #Javascript
javascript获取本机操作系统类型的方法
Aug 13 #Javascript
javascript中offset、client、scroll的属性总结
Aug 13 #Javascript
用JavaScript实现PHP的urlencode与urldecode函数
Aug 13 #Javascript
You might like
PHP实现的多文件上传类及用法示例
2016/05/06 PHP
实例:尽可能写友好的Javascript代码
2006/10/09 Javascript
js检测客户端不是firefox则提示下载
2007/04/07 Javascript
深入理解JavaScript编程中的同步与异步机制
2015/06/24 Javascript
深入理解jQuery中的事件冒泡
2016/05/24 Javascript
深入理解JavaScript函数参数(推荐)
2016/07/26 Javascript
基于JavaScript实现带缩略图的轮播效果
2017/01/12 Javascript
详解webpack es6 to es5支持配置
2017/05/04 Javascript
详解vue-resource promise兼容性问题
2017/06/20 Javascript
基于Bootstrap表单验证功能
2017/11/17 Javascript
nodejs实现OAuth2.0授权服务认证
2017/12/27 NodeJs
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
Vue 全局loading组件实例详解
2018/05/29 Javascript
vue router的基本使用和配置教程
2018/11/05 Javascript
layui实现多图片上传并限制上传的图片数量
2019/09/26 Javascript
vue大型项目之分模块运行/打包的实现
2020/09/21 Javascript
videocapture库制作python视频高速传输程序
2013/12/23 Python
python发腾讯微博代码分享
2014/01/10 Python
Python multiprocessing.Manager介绍和实例(进程间共享数据)
2014/11/21 Python
Python中shutil模块的常用文件操作函数用法示例
2016/07/05 Python
python利用urllib和urllib2访问http的GET/POST详解
2017/09/27 Python
python实现图片批量压缩程序
2018/07/23 Python
JSON文件及Python对JSON文件的读写操作
2018/10/07 Python
Python何时应该使用Lambda函数
2019/07/02 Python
Python collections中的双向队列deque简单介绍详解
2019/11/04 Python
20行Python代码实现视频字符化功能
2020/04/13 Python
Python3爬虫关于识别点触点选验证码的实例讲解
2020/07/30 Python
国际化的太阳镜及太阳镜配件零售商:Sunglass Hut
2016/07/26 全球购物
Why do we need Unit test
2013/01/03 面试题
中文专业毕业生自荐信
2013/10/28 职场文书
军训自我鉴定怎么写
2014/02/13 职场文书
确保工程质量承诺书
2015/04/29 职场文书
小兵张嘎观后感300字
2015/06/03 职场文书
小学班主任教育随笔
2015/08/15 职场文书
PHP对接阿里云虚拟号的实现(号码隐私保护)
2021/04/06 PHP
php 文件上传至OSS及删除远程阿里云OSS文件
2021/07/04 PHP