JQuery总结-radioButton、checkBox相关

最新推荐文章于 2020-02-09 15:49:00 发布

→→→→

最新推荐文章于 2020-02-09 15:49:00 发布

阅读量518

点赞数

分类专栏： JavaScript/JQuery

本文链接：https://blog.csdn.net/zou_yufei/article/details/9958481

版权

JavaScript/JQuery 专栏收录该内容

22 篇文章 1 订阅

订阅专栏

<!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>
    <title></title>
    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">

        function t() {
            //获得所有单选按钮   且属性name=gender的  且是选中的
            alert($(":radio[name=gender]:checked").val());
        }


        function t1() {
            //注意  val中必须是[]    
            //给所有单选按钮 且属性是name=gender的设置value属性
            $(":radio[name=gender]").val(["男"]);
        }

        function t2() {
            //注意  val中必须是[]  给value=a和b的checkbox选中
            $(":checkbox").val(["a", "b"]);
        }

        function t3() {
            //将div1中所有checkbox设置选中
            $("#div1 input[type=checkbox]").attr("checked", true);
        }


        function t4() {
            //将div1中所有checkbox设置不选中
            $("#div1 :checkbox").attr("checked", false);
        }


        function t5() {
            //遍历div1中所有的checkbox
            $("#div1 input[type=checkbox]").each(function () {
                //设置当前Checkbox的checked属性为当前的反
                $(this).attr("checked", !$(this).attr("checked"));
            }
            );
        }

        function t6() {
            var tmp1 = $("#div1 input[type=checkbox]:checked");
            var tmp2 = $("#div1 input[type=checkbox][checked=false]");
            tmp1.attr("checked", false);
            tmp2.attr("checked", true);
        }

    </script>
</head>
<body>
    <input type="radio" value="男" name="gender" />男
    <input type="radio" value="女" name="gender" />女
    <br />
    <button οnclick="t()">
        获取选中的value</button><br />
    <br />
    <button οnclick="t1()">
        设置选中的radiobutton(通过设置value的值 来决定哪个选中)</button>
    <hr />
    <input type="checkbox" value="a" />a
    <input type="checkbox" value="b" />b
    <input type="checkbox" value="c" />c
    <input type="checkbox" value="d" />d<br />
    <button οnclick="t2()">
        设置选中的checkbox(通过设置value的值 来决定哪个选中)</button>
    <hr />
    <p>
        也可单独通过$(xxx).att("checked",true)来设置选中</p>
    <hr />
    <div id="div1">
        <input type="checkbox" value="a" />a
        <input type="checkbox" value="b" />b
        <input type="checkbox" value="c" />c
        <input type="checkbox" value="d" />d<br />
    </div>
    <button οnclick="t3()">
        全选(注意过滤器前有个空格)</button>
    <button οnclick="t4()">
        全不选</button>
    <button οnclick="t5()">
        反选1</button>
    <button οnclick="t6()">
        反选2</button>
</body>
</html>

→→→→

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery总结-radioButton、checkBox相关

function t() { //获得所有单选按钮且属性name=gender的且是选中的 alert($(":radio[name=gender]:checked").val()); } function t1() { //注意 val中必须是[]
复制链接

扫一扫