• jquery全选+下拉+单选+事件+挂事件


    1.全选

    <body>
    <input type="checkbox" id="qx" /> 全选
    <input type="checkbox" value="01" class="ck" />
    <input type="checkbox" value="02" class="ck" />
    <input type="checkbox" value="03" class="ck" />
    <input type="checkbox" value="04" class="ck" />
    <input type="checkbox" value="05" class="ck" />
    </body>
    
    <script type="text/javascript">
    $("#qx").click(function(){
        var xz = $(this).prop("checked");//设置($this)这个全选按钮自身的属性是"checked"
        var ck = $(".ck").prop("checked",xz);//xz放入之前的prop里的属性为ture
    })
    </script>

    2.下拉

    <select id="sel">
        <option value="1111">1111</option>
        <option value="2222">2222</option>
        <option value="3333">3333</option>
    </select>
    <input type="button" value="取下拉" id="b1" />
    
    
    
    <script type="text/javascript">$("#b1").click(function(){
        alert($("#sel").val());        
    })
    </script>

    3.单选

    <input type="radio" value="01" class="rd"  name="a"/>
    <input type="radio" value="02" class="rd" name="a" />
    <input type="radio" value="03" class="rd" name="a" />
    <input type="radio" value="04" class="rd" name="a" />
    <input type="radio" value="05" class="rd" name="a" />
    <input type="button" value="取单选" id="b2" />
    
    
    <script type="text/javascript">
    $("#b2").click(function(){
        var rd = $(".rd");
        for(var i=0;i<rd.length;i++)
        {
            if(rd[i].checked)
            {
                alert(rd[i].value);    
            }    
        }    
    })
    </script>

    加事件

    <style type="text/css">
    .aaa{ width:150px; height:150px; background-color:#06F}
    </style>
    
    <body>
    <div class="aaa">111111</div>
    <div class="aaa">222222</div>
    <div class="aaa">333333</div>
    </body>
    
    <script type="text/javascript">
    $(document).ready(function(e) {
        $(".aaa").click(function(){
            $(".aaa").css("background-color","#06f");
            $(this).css("background-color","red");
            })
    });
    </script>

    挂事件

    <input type="button" value="挂事件" id="btn" />
    <input type="button" value="移除事件" id="btn1" />
    <div id="a" style="100px; height:100px">cccc</div>
    
    <script type="text/javascript">
    $(document).ready(function(e) {
        $("#btn").click(function(){
            $("#a").bind("click",function(){
                $("#a").css("background-color","red");
                alert("事件");
                })
            })
        $("#btn1").click(function(){
            $("#a").unbind("click");
            })
    });
    </script>
  • 相关阅读:
    安装Eclipse for MAC 苹果版
    visual studio code emmet 插件不提示?解决方案
    支付宝付款页面调整屏幕亮度
    浅谈iOS需要掌握的技术点
    Objective-C 编程艺术 (Zen and the Art of the Objective-C Craftsmanship 中文翻译)
    ios开发数据库版本迁移手动更新迭代和自动更新迭代艺术(-)
    ios 添加到cell 上的button点击无效!扩大button的点击区域(黑魔法)
    个人中心模块-拍照剪裁上传
    利用js与java交互
    显示gif动画(帧动画的播放)
  • 原文地址:https://www.cnblogs.com/zxl89/p/6048880.html
Copyright © 2020-2023  润新知