jQuery获取radio选中项的值实例

<title></title>
  <script src="js/jquery-1.7.2.min.js"></script>
  <script type="text/javascript">
    $(function () {
      //没有默认选中的情况
      //先判断radio是否有选中项,再获取选中的值
      $("#btnclick").click(function () {
        //获取选中项的value属性
        var chkRadio = $('input:radio[name="list"]:checked').val();
        if (chkRadio == null) {
          alert("没有选中项");
          return false;
        } else {
          alert(chkRadio);
        }
      });

      //有默认选中的情况
      //获取选中项的值,一般采用遍历的方法,判断哪一项选中,获取其value属性的值
      $("#btnclick2").click(function () {
        var chk2 = getRadioValue("list2");
        alert(chk2);
      });

      function getRadioValue(radioName) {
        var chkRadio = document.getElementsByName(radioName);
        for (var i = 0; i < chkRadio.length; i++) {
          if (chkRadio[i].checked)
            return chkRadio[i].value;
        }
      }

    })
  </script>
</head>

<body>
  <div>
    <input type="radio" name="list" value="十分满意" />十分满意
    <input type="radio" name="list" value="满意" />满意
    <input type="radio" name="list" value="不满意" />不满意
    <input type="radio" name="list" value="非常差" />非常差
  </div>
  <br />
  <div>
    <input type="radio" name="list2" value="十分满意2" checked="checked" />十分满意2
    <input type="radio" name="list2" value="满意2" />满意2
    <input type="radio" name="list2" value="不满意2" />不满意2
    <input type="radio" name="list2" value="非常差2" />非常差2
  </div>
  <input type="button" value="确定" id="btnclick" />
  <input type="button" value="确定2" id="btnclick2" />
</body>
</html>

演示截图:

1.没有默认选中项的情况下,获取为null:

2.没有默认选中项的情况下,获取选中项的value值:

3.有选中项的情况下,获取选中项的值:

以上就是本文的全部内容,希望这个方法也能给遇到相同问题的其他人带来帮助,也希望大家多多支持我们。

(0)

相关推荐

  • jQuery中获取Radio元素值的方法

    又发现自己写的JavaScript代码在FireFox下运行出错,原因很郁闷,在获取一个Radio元素的值的时候只得到了 undefind.谷歌了一下,大多跟我用的方法是一样的 复制代码 代码如下: var value = $("input[name='radio1'][type='radio'][checked]").val(); 这句在IE.Safari(3.2)下测试通过,但是在FireFox.Chrome下却得不到选中的值.仔细再看手册,发现"表单对象属性"

  • Jquery 获取表单text,areatext,radio,checkbox,select值的代码

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $('input[@name=items][@checked]').val(); 获取select被选中项的文本 var item = $("select[@name=items] option[@selected]").text(); select下拉框的第二个元素为当前选中值 $('#selec

  • JQuery判断radio是否选中并获取选中值的示例代码

    其他对radio操作功能,以后在添加.直接上代码,别忘记引用JQuery包 <!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&

  • 如何使用Jquery获取Form表单中被选中的radio值

    Jquery提供的选择器极大的方便了开发人员对Dom的操作,真正实现了代码简化,却功能强大的目标.下面就日常最常用的,在Form表单中如何获取被中选的Radio值做一小小的示例. form表单如下: 复制代码 代码如下: <form name='form1' action="#" method="post"> 此处略去200字 <input type="radio" name="opType" value=&

  • JQuery判断radio(单选框)是否选中和获取选中值方法总结

    一.利用获取选中值判断选中 直接上代码,别忘记引用JQuery包 复制代码 代码如下: <!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"> <

  • jQuery获取Radio,CheckBox选择的Value值(示例代码)

    $("input[name='radio_name'][checked]").val(); //选择被选中Radio的Value值$("#text_id").focus(function(){//code...}); //事件 当对象text_id获取焦点时触发$("#text_id").blur(function(){//code...}); //事件 当对象text_id失去焦点时触发$("#text_id").selec

  • jquery获取radio值(单选组radio)

    单选组radio: $("input[@type=radio][@checked]").val(); 单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项 获取一组radio被选中项的值 var item = $('input[@name=items][@checked]').val(); radio单选组的第二个元素为当前选中值 $('input[@

  • jQuery根据ID获取input、checkbox、radio、select的示例

    input: var xxx = $('#ID').val() --------------------------------------------------------------------------------- checkbox: var xxx = [ ]; $('input[name=MyName]:checked).each(function(index, element) { xxx.push($(element).val()); // 或者 xxx.push($(thi

  • jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值

    -.获取dropdownlist的text(ddlList为服务器端dropdownlist的ID,生成name属性等于ddlList的select标签) $("#ddlList option:selected").text() 二.获取dropdownlist的value(ddlList为服务器端dropdownlist的ID,生成name属性等于ddlList的select标签) $("#ddlList").val() 三.获取radiobuttonlist的t

  • 使用jQuery获取radio/checkbox组的值的代码收集

    复制代码 代码如下: <!-- $("document").ready(function(){ $("#btn1").click(function(){ $("[name='checkbox']").attr("checked",'true');//全选 }) $("#btn2").click(function(){ $("[name='checkbox']").removeAtt

  • jquery判断RadioButtonList和RadioButton中是否有选中项示例

    复制代码 代码如下: <pre class="html" name="code"> <%--Body 代码--%> <div> <asp:RadioButtonList ID="RadioButtonList1" runat="server"> <asp:ListItem Value="A">a</asp:ListItem> <a

  • Jquery 改变radio/checkbox选中状态,获取选中的值(示例代码)

    //如果之前有选中的,则把选中radio取消掉$("#tj_cat .pro_category").each(function(){ if ($(this).attr('checked')){                        $(this).attr('checked' ,false);                    }});//获取被选中的标签的值radio:(checkbox和这个一样) var val=$('input:radio[name="se

随机推荐