Home > Web Front-end > JS Tutorial > body text

How to determine whether the radio is selected in jquery

coldplay.xixi
Release: 2023-01-04 09:37:03
Original
5527 people have browsed it

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>
Copy after login

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>
Copy after login
Copy after login

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>
Copy after login
Copy after login

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()); 
} 
}
Copy after login

4. Set the radio button to be selected

The code is as follows:

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

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!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!