RadioButton操作

单选框操作:获取单选框选中的值,以及代码设置单选框选中状态。

  • $("input[name=gender]:checked").val():获取name=gender且被选中的单选框value
  • $('input:radio[name=gender]').val(["女"]):设置value为女的单选框选中
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm30.aspx.cs" Inherits="WebApplication1.WebForm30" %>
<html xmlns="[http://www.w3.org/1999/xhtml](http://www.w3.org/1999/xhtml)">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="[http://libs.baidu.com/jquery/1.8.3/jquery.min.js](http://libs.baidu.com/jquery/1.8.3/jquery.min.js)"></script>
    <script>
        function sub() {
            alert($("input[name=gender]:checked").val());
        }

        function choice()
        {
            $('input:radio[name=gender]').val(["女"]);
        }
    </script>
</head>
<body>
    <label>选择性别:</label>
    <input type="radio" name="gender" value="男" /><input type="radio" name="gender" value="女" /><input type="radio" name="gender" value="保密" checked="checked" />保密
    <br />
    <div>
        <button type="button" onclick="sub()">提交</button>
        <button type="button" onclick="choice()">选择女的</button>
    </div>
</body>
</html>
Code language: HTML, XML (xml)

说明:

  1. :radio 表单选择器匹配单选按钮;:checked 匹配当前选中项
  2. 点击【提交】弹出当前选中单选框的值
  3. 点击【选择女的】,自动选中value=”女”的单选框

补充:jQuery1.8+推荐用prop("checked",true)来修改勾选状态,本案例保持课程原版写法。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注