zoukankan      html  css  js  c++  java
  • Jquery事件

    一、Jquery加事件

    Jquery第一个事件:页面加载完成事件

    没有方法名的函数叫逆名函数;

    把方法交给函数的方式叫作委托或代理;

    //页面加载完成
    $(document).ready();
    //把方法作为参数给它
    $(document).ready(function(e) { //e代表事件数据,可以写可以不写
       
    });

    例子:给三个div加事件

    <script src="jquery-1.11.2.min.js"></script>
    </head>
    
    <body>
    <div class="aa" bs="1" style="100px; height:100px; background-color:red">11111</div>
    <div class="aa" bs="2" style="100px; height:100px; background-color:blue">22222</div>
    <div class="aa" bs="3" style="100px; height:100px; background-color:purple">33333</div>
    
    </body>
    </html>
    <script type="text/javascript">
    
    $(document).ready(function(e) {
        //1.给三个div加点击事件
        $(".aa").click(function(e) {
            alert("hello world");
      
      //2.取三个div里的值
        $(".aa").click(function(e) { alert($(this).text());
      //3.取三个div里属性值
      $(".aa").click(function(e) {
            alert($(this).attr("bs"));
      
      // 4.给三个div统一加改变属性事件
      $(".aa").click(function(e) {
         $(".aa").css("background-color","red");
          $(this).css("background-color","green");
          });
      }); });
    </script>

    二、Jquery挂事件

    <script src="jquery-1.11.2.min.js"></script>
    </head><body>


    <div id="a1" style="100px; height:100px; "></div>
    <input type="text" id="p1" />
    <input type="button" id="b1" value="挂事件" />
    <input type="button" id="b2" value="移除事件" />

    </body>
    </html>
    <script type="text/javascript">

    $(document).ready(function(e) {
     //给三个div加点击事件
      $("#b1").click(function(){
         $("#a1").bind("click",function(){
            alert("我是挂上的事件");
          });
       });
      
        $("#b2").click(function(){
            $("#a1").unbind("click");
       });
    });
    </script>

  • 相关阅读:
    Docker搭建NSQ实时分布式消息集群
    雪花算法
    代码抽象三原则
    PostgreSQL12-主从复制
    logrus日志框架
    Golang中的布隆过滤器
    golang-Json编码解码
    List分组迭代器
    redis-cli命令行远程连接redis服务
    pycharm常用快捷键与设置
  • 原文地址:https://www.cnblogs.com/wells33373/p/6072186.html
Copyright © 2011-2022 走看看