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 相关文章推荐
javascript 点击整页变灰的效果(可做退出效果)。
Jan 09 Javascript
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
Dec 16 Javascript
jQuery选择器querySelector的使用指南
Jan 23 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
Apr 18 Javascript
json传值以及ajax接收详解
May 24 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
JavaScript制作颜色反转小游戏
Sep 25 Javascript
Node.js学习入门
Jan 03 Javascript
代码详解JS操作剪贴板
Feb 11 Javascript
vue cli使用融云实现聊天功能的实例代码
Apr 19 Javascript
解决vue-cli 打包后自定义动画未执行的问题
Nov 12 Javascript
JS字符串和数组如何实现相互转化
Jul 02 Javascript
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之第十天
2006/10/09 PHP
比file_get_contents稳定的curl_get_contents分享
2012/01/11 PHP
PHP 微信扫码支付源代码(推荐)
2016/11/03 PHP
php版阿里云OSS图片上传类详解
2016/12/01 PHP
yii2 数据库读写分离配置示例
2017/02/10 PHP
YII2.0框架行为(Behavior)深入详解
2019/07/26 PHP
javawscript 三级菜单的实现原理
2009/07/01 Javascript
javascript 模式设计之工厂模式学习心得
2010/04/27 Javascript
Juqery Html(),append()等方法的Bug解决方法
2010/12/13 Javascript
JavaScript生成GUID的多种算法小结
2013/08/18 Javascript
PHP中使用微秒计算脚本执行时间例子
2014/11/19 Javascript
jQuery中contents()方法用法实例
2015/01/08 Javascript
jQuery中 delegate使用的问题
2015/07/03 Javascript
JavaScript实现的简单烟花特效代码
2015/10/20 Javascript
微信小程序 保留小数(toFixed)详细介绍
2016/11/16 Javascript
用iframe实现不刷新整个页面上传图片的实例
2016/11/18 Javascript
node.js操作mysql简单实例
2017/05/25 Javascript
利用JS实现一个同Excel表现的智能填充算法
2018/08/13 Javascript
JS中DOM元素的attribute与property属性示例详解
2018/09/04 Javascript
jQuery实现购物车的总价计算和总价传值功能
2018/11/28 jQuery
python中实现定制类的特殊方法总结
2014/09/28 Python
python中dir()与__dict__属性的区别浅析
2018/12/10 Python
Python获取Redis所有Key以及内容的方法
2019/02/19 Python
初探利用Python进行图文识别(OCR)
2019/02/26 Python
python实现学生管理系统开发
2020/07/24 Python
Python如何重新加载模块
2020/07/29 Python
css3media响应式布局实例
2016/07/08 HTML / CSS
Juicy Couture Beauty官方网站:香水和化妆品
2019/03/12 全球购物
几个SQL的面试题
2014/03/08 面试题
总经理秘书岗位职责
2014/03/17 职场文书
国旗下的演讲稿
2014/05/08 职场文书
2014个人四风对照检查材料思想汇报
2014/09/18 职场文书
学生检讨书范文
2015/01/27 职场文书
《我是什么》教学反思
2016/02/16 职场文书
Nest.js参数校验和自定义返回数据格式详解
2021/03/29 Javascript
win10壁纸在哪个文件夹 win10桌面背景图片文件位置分享
2022/08/05 数码科技