<!DOCTYPE html>
<html>
<html>
<head>
<meta charset="UTF-8">
<title>Js获取单选按钮的值</title>
</head>
<meta charset="UTF-8">
<title>Js获取单选按钮的值</title>
</head>
<body>
<input type="radio" name="sx" value="女" checked="checked" />女
<input type="radio" name="sx" value="男" />男
<input type="radio" name="sx" value="人妖" >人妖
<input type="radio" name="sx" value="妖精" />妖精<br/>
<!--单选按钮name必须一样 checked是指获得焦点-->
<input type="button" id="but" value="提交1" /><br/>
<input type="button" id="buttons" value="提交2" />
</body>
<script src="../js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//第一种方式,使用JavaScript的方法获取.这个代码比较多
var but=document.getElementById("but");
but.οnclick=function(){
var sex = document.getElementsByName("sx");
var se = sex.length;
var sexid;
for (var i = 0; i < se; i++) {
if (sex[i].checked == true) {
sexid = sex[i].value;
break;
}
}
console.log("单选按钮"+sexid);
};
//第二种方法使用jQuery选择器
$("#buttons").click(function(){
//我的理解是jQuery选择器,找到所有的input-->type=radio且name=sx的获得焦点的那个
var result=$("input:radio[name='sx']:checked").val();
console.log(result);
});
</script>
<input type="radio" name="sx" value="女" checked="checked" />女
<input type="radio" name="sx" value="男" />男
<input type="radio" name="sx" value="人妖" >人妖
<input type="radio" name="sx" value="妖精" />妖精<br/>
<!--单选按钮name必须一样 checked是指获得焦点-->
<input type="button" id="but" value="提交1" /><br/>
<input type="button" id="buttons" value="提交2" />
</body>
<script src="../js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//第一种方式,使用JavaScript的方法获取.这个代码比较多
var but=document.getElementById("but");
but.οnclick=function(){
var sex = document.getElementsByName("sx");
var se = sex.length;
var sexid;
for (var i = 0; i < se; i++) {
if (sex[i].checked == true) {
sexid = sex[i].value;
break;
}
}
console.log("单选按钮"+sexid);
};
//第二种方法使用jQuery选择器
$("#buttons").click(function(){
//我的理解是jQuery选择器,找到所有的input-->type=radio且name=sx的获得焦点的那个
var result=$("input:radio[name='sx']:checked").val();
console.log(result);
});
</script>
</html>
1336
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
