javascript判断单选框或复选框是否选中方法集锦

最新推荐文章于 2022-04-03 19:29:25 发布
最新推荐文章于 2022-04-03 19:29:25 发布
阅读量1.2k 收藏 3
点赞数
提示：getEmementsByName方法的作用是根据 NAME 标签属性的值获取对象的集合。 
样例一<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>判断单选框或复选框是否选中</title> 
</head> 


<body> 
<input name="radio1" type="radio" value="test"> 
<button onClick="alert('单选项'+(document.getElementsByName('radio1')[0].checked? '':'没有')+'选中')">测试</button><br> 
<input name="radio1" type="radio" value="test"> 
<button onClick="alert('单选项'+(document.getElementsByName('radio1')[1].checked?'':'没有')+'选中')">测试</button><br> 


<input name="checkbox1" type="checkbox" value="test"> 
<button onClick="alert('多选项'+(document.getElementsByName('checkbox1')[0]. checked?'':'没有')+'选中')">测试</button><br> 
<input name="checkbox1" type="checkbox" value="test"> 
<button onClick="alert('多选项'+(document.getElementsByName('checkbox1')[1].checked?'':'没有')+'选中')">测试</button> 


提示：getEmementsByName方法的作用是根据 NAME 标签属性的值获取对象的集合。 
</body> 
</html> 
样例二： 


<form name="myform" action="" method="" οnsubmit="return check()"> 
<input type="radio" name="picno" value="1"> 
<input type="radio" name="picno" value="2"> 
<input type="radio" name="picno" value="3"> 
<input type="submit" value="Submit"> 
</form> 
<script language="JavaScript">... 
function check()...{ 
var flag=0 
for(i=0;i<myform.picno.length;i++) 
if(myform.picno[i].checked==true)...{ 
flag=1 
break 
} 
if(!flag)...{ 
alert("请先选择更换图片的位置") 
return false 
} 
} 
</script> 

详细出处参考：http://www.jb51.net/article/9162.htm

-
-
 
<html> 
<head> 
<script> 
function foo() 
{ 
// 在此处添加代码 
var rg = document.getElementsByName("radioGroup"); 
for( var i = 0; i < rg.length; i++ ) 
{ 
if( rg[i].checked ) 
{ 
alert("你选择了第" + (i+1) + "个单选框"); 
} 
} 
return false; 
} 
</script> 
</head> 
<body> 
<form name=www.111cn.net οnsubmit="return foo();"> 
<input type="radio" name="radioGroup" /> 
<input type="radio" name="radioGroup" /> 
<input type="radio" name="radioGroup" /> 
<input type="radio" name="radioGroup" /> 
<input type="radio" name="radioGroup" /> 
<input type="radio" name="radioGroup" /> 
<input type="submit" /> 
</form> 
</body> 
</html>


更多详细内容请查看：http://www.111cn.net/wy/99/35cc8fa94bf9265ca9418c238bfa8203.htm


苍月代表我
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript检测复选框或单选框是否有选中
civilized的专栏
06-27 906
//检测复选框是否有选中 function checkedCheckBox(){  var objs = document.getElementByTagName("input"); //获取页面控件  if(objs){   var list =[];   for(var i = 0;i    if(objs[i] && objs[i].type && objs[i].type =
JS判断HTML中创建的单选框、复选框、下拉列表框是否被选中
m0_53881899的博客
09-12 2926
JS判断HTML中创建的单选框、复选框、下拉列表框是否被选中
用javascript判断radio/checkbox是否被选中
战斗机
05-06 437
1.用javascript判断radio单选框是否被选中,我们以选择性别为例: [code="html"]性别:男 女 [/code] [code="js"] var sex_obj = document.getElementsByName('sex'); var temp_sex = false; for(var i = 0; i < sex_obj.lengt...
使用JS判断单选按钮和复选框是否被选中的代码
u012475710的专栏
12-27 1185
function getEvent() { if(document.all) { return window.event;//如果是ie } func=getEvent.caller; while(func!=null) { var arg
泛微OA常用js代码块
没有故事的博主
02-10 1万+
泛微OA常用js代码块 本文章向大家介绍泛微OA常用js代码块，主要包括泛微OA常用js代码块使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。 01.泛微系统alert提示框 Dialog.alert("警告框"); 02.checkbox被选中监听事件，监听checkbox复选框 打开表单首先隐藏行 如果checkbox被选中 显示行 <!-- script代码，如果需要引用js文件，请使用与HTML中相同的方式。 --> <s
JS判断单选框是否选中
jql20182107的博客
03-16 2450
判断身份信息和性别是否选中 function checkNotNull1(obj){ var nodex = document.getElementsByName(obj); var msg = document.getElementById(obj+“Msg”); var div = document.getElementById(obj+“Div”); var flag = false; for(var i=0;i<nodex.length;i++){ //选择框不为空 if(nodex[i].c
用js判断页面中的单选框是否选中
cj1193246987的博客
08-21 876
主要是用来判断一列单选框是否被选中，其选中后，通过按钮调到另一个action,从而转到另一个所需要的页面<1>jsp页面 ...... value="...
JS判断单选框是否被选中事件
热门推荐
zhumizhumi的博客
10-28 1万+
<form> <input type="radio" id="radio1" /> <input type="button" onclick="check()" value="选中" /> <input type="button" onclick="uncheck()" value="取消" /> </form> fu...
JS判断单个checkbox是否被选中
03-01
博文链接：https://qsfwy.iteye.com/blog/234087
js判断radio是否被选中
11-12
php开发判断radio，此次应用在单选框中利用js判断。
判断radio是否被选中
07-16
基于asp语言，用来判断radio控件是否被选中
js获取单选框或复选框值及操作
10-27
在JavaScript中，获取单选框或复选框的值是一项常见的任务，特别是在处理用户输入或者构建表单提交功能时。本文将详细介绍如何使用JavaScript来获取这些控件的值，并进行一些基本的操作。 首先，让我们来看一下如何...
layui 监听表格复选框选中值的方法
10-18
总结，layui监听表格复选框选中值的方法主要包括：初始化表格数据、监听复选框事件、处理选中和取消操作，以及异步请求后台。通过这种方式，我们可以灵活地根据用户的交互更新数据并传递给服务器，实现了动态数据...
jquery判断复选框选中状态以及区分attr和prop
10-23
在jQuery中，正确判断复选框（checkbox）的选中状态是通过`prop()`方法来实现的，因为`prop()`是用于处理元素的固有属性，比如`checked`属性。在jQuery 1.6之前，人们通常使用`attr()`来获取或设置属性，但这可能...
js判断单选框是否选中
HashShark的博客
08-21 1682
$('#md').is(':checked') 返回true/false
javascript判断单选框是否选中
啊哈前端的专栏
01-05 6086
判断单选框是否选中 window.onload=function(){ var ganders=document.getElementsByName("gander"),length=ganders.length,i=0; for(;i<length;i++){ ganders[i].onclick=f
Js判断是否有文件选中
weixin_42619089的博客
04-03 1443
当我在上传文件时判断是否有文件选中时，加入了如下代码： <script type="text/javascript"> function getValue() { console.log("123"); var x=document.getElementById("chooseFile").value; if(x=="") {
使用JS控制单选框复选框和下拉框的回显
最新发布
05-25
单选框和复选框的回显可以使用 JavaScript 的 DOM 操作来实现。假设我们有以下 HTML 代码： ```html <label for="option1">选项1</label> <input type="radio" id="option1" name="options" value="1"> <label for="option2">选项2</label> <input type="radio" id="option2" name="options" value="2"> <label for="option3">选项3</label> <input type="checkbox" id="option3" name="options" value="3"> <label for="option4">选项4</label> <input type="checkbox" id="option4" name="options" value="4"> ``` 我们可以通过以下 JavaScript 代码来实现单选框和复选框的回显： ```javascript // 获取单选框和复选框元素 var option1 = document.getElementById("option1"); var option2 = document.getElementById("option2"); var option3 = document.getElementById("option3"); var option4 = document.getElementById("option4"); // 设置单选框和复选框的默认选中状态 option1.checked = true; option3.checked = true; // 监听单选框和复选框的变化，更新选中状态 option1.addEventListener("change", function() { option2.checked = false; }); option2.addEventListener("change", function() { option1.checked = false; }); option3.addEventListener("change", function() { option4.checked = false; }); option4.addEventListener("change", function() { option3.checked = false; }); ``` 这段代码首先获取了四个单选框和复选框的元素，并设置了选项1和选项3为默认选中状态。然后通过监听单选框和复选框的变化，更新其他选项的选中状态。 下拉框的回显也可以使用 JavaScript 的 DOM 操作来实现。假设我们有以下 HTML 代码： ```html <select id="fruit"> <option value="apple">苹果</option> <option value="banana">香蕉</option> <option value="orange">橙子</option> </select> ``` 我们可以通过以下 JavaScript 代码来实现下拉框的回显： ```javascript // 获取下拉框元素 var fruit = document.getElementById("fruit"); // 设置下拉框的默认选中状态 fruit.value = "banana"; // 监听下拉框的变化，更新选中状态 fruit.addEventListener("change", function() { if (fruit.value === "apple") { // do something } else if (fruit.value === "banana") { // do something } else if (fruit.value === "orange") { // do something } }); ``` 这段代码首先获取了下拉框的元素，并设置了香蕉为默认选中状态。然后通过监听下拉框的变化，更新其他选项的选中状态。根据选中的值，可以执行不同的操作。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值