Home  >  Article  >  Web Front-end  >  How to determine whether the radio is selected in jquery

How to determine whether the radio is selected in jquery

coldplay.xixi
coldplay.xixiOriginal
2020-12-11 15:04:175549browse

Jquery method to determine whether the radio is selected: 1. Use the selected value to determine the selection; 2. Use the checked attribute to determine the selection; 3. jquery gets the value of the radio button; 4. Set the radio button to be selected.

How to determine whether the radio is selected in jquery

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, thinkpad t480 computer.

Recommended: jquery video tutorial

Jquery method to determine whether the radio is selected:

1. Use acquisition Selected value judgment

Directly upload the code, don’t forget to quote the JQuery package

The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery radio</title>
<script type="text/javascript" language="javascript" src="JavaScript/jquery-1.6.1.min.js" ></script>
<script type="text/javascript" language="javascript">
 /*------判断radio是否有选中,获取选中的值--------*/
    $(function(){
         $("#btnSubmit").click(function(){
            var val=$(&#39;input:radio[name="sex"]:checked&#39;).val();
            if(val==null){
                alert("什么也没选中!");
                return false;
            }
            else{
                alert(val);
            }
            var list= $(&#39;input:radio[name="list"]:checked&#39;).val();
            if(list==null){
                alert("请选中一个!");
                return false;
            }
            else{
                alert(list);
            }           
         });
     });
</script>
</head>
 
<body>
<form id="form1" >
<input type="radio"  name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
<br />
<input type="radio"  name="list" value="十分满意" />十分满意
<input type="radio" name="list" value="满意" />满意
<input type="radio" name="list" value="不满意" />不满意
<input type="radio" name="list" value="非常差" />非常差
<br />
<input type="submit" value="submit"  id="btnSubmit" />
</form>
</body>
</html>

radio cannot be judged by "checked" equality, only use Use true to judge

The code is as follows:

<script type="text/javascript">
        $(function () {
            $("input").click(function () {
                if ($(this).attr("checked")) {
                    alert("选中了");
                }
            });
        });
    </script>
</head>
<body>
<input type="radio"/>
</body>
</html>

2. Use the checked attribute to judge the selection

radio cannot be judged by "checked" equality, only Use true to judge

The code is as follows:

<script type="text/javascript">
        $(function () {
            $("input").click(function () {
                if ($(this).attr("checked")) {
                    alert("选中了");
                }
            });
        });
    </script>
</head>
<body>
<input type="radio"/>
</body>
</html>

3. jquery gets the value of the radio radio button

Another: Determine whether the radio is selected and Get the selected value

The code is as follows:

function checkradio(){ 
var item = $(":radio:checked"); 
var len=item.length; 
if(len>0){ 
  alert("yes--选中的值为:"+$(":radio:checked").val()); 
} 
}

4. Set the radio button to be selected

The code is as follows:

$("input[type=radio]").attr("checked",&#39;2&#39;);//设置value=2的项目为当前选中项

Related free learning recommendations: javascript(Video)

The above is the detailed content of How to determine whether the radio is selected in jquery. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:What is jquery LigerUI?Next article:What is jquery LigerUI?