jQuery获取及设置单选框实例介绍

来源:互联网 时间:1970-01-01

单选组radio是html中的一个常用的html控制了,下面我来给大家介绍在jquery中获取及设置单选框程序代码,有需要了解的朋友可参考参考。

单选组radio: $("input[@type=radio][@checked]").val();

获取一组radio被选中项的值

var item = $("input[@name=items][@checked]").val();

获取select被选中项的文本

var item = $("select[@name=items] option[@selected]").text();

select下拉框的第二个元素为当前选中值

$("#select_id")[0].selectedIndex = 1;

radio单选组的第二个元素为当前选中值

$("input[@name=items]").get(1).checked = true;

设置单选组值

单选组radio: $("input[@type=radio]").attr("checked","2");//设置value=2的项目为当前选中项 (错

$("input[@name=radio_s][@value=16]").attr("checked",true);(测试通过)

例1

 代码如下 复制代码

<asp:RadioButtonList runat="server" ID="rblShow" class="show"

RepeatDirection="Horizontal">

<asp:ListItem Text="是" value="1" />

<asp:ListItem Text="否" value="0"/>

</asp:RadioButtonList>

<p class="isShow" style="width: 500px">

测试文字

</p>

然后在脚本js中添加Jquery引用后。

 代码如下 复制代码

<script type="text/javascript">
$(function () {
$(":radio").click(function () {
if ($(this).val() == "1") {
$(".isShow").fadeIn();
} else {
$(".isShow").fadeOut();
}
})
})

例2

 代码如下 复制代码

<html>
<head>
<script type="text/javascript" src="/ajaxjs/jquery1.3.2.js">
    </script>
    <script type="text/javascript">
        $(function(){
            $("#form1").submit(function(){

           if($("#form1 input:checked")){
               alert($("#form1 input:checked").val());
       }

                return false; //不提交
  });
 });
    </script>
    <title>单选框测试</title>
</head>
<body>
    <form id="form1">
        <input type="radio" name="items" id="item1" value="a"/>A
        <br/>
        <input type="radio" name="items" id="item2" value="b"/>B
        <br/>
        <input type="radio" name="items" id="item3" value="c"/>C
        <br/>
        <input type="radio" name="items" id="item4" value="d"/>D
        <br/>
        <input type="radio" name="items" id="item5" value="e"/>E
        <br/>
        <input type="radio" name="items" id="item6" value="f"/>F
        <br/>
        <input type="radio" name="items" id="item7" value="g"/>G
        <br/>
        <input type="radio" name="items" id="item8" value="h"/>H
        <br/>
        <input type="submit" id="btn1">
    </form>
</body>
</html>




相关阅读:
Top