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>

  • 相关阅读:
    1-29反射
    1-28Map简介
    1-27TreeSet简介
    1-26HashSet简介
    1-25泛型
    1-24List三个子类的特点
    1-23集合概述
    Java接口
    1-22日期类型
    简易计算器的实现
  • 原文地址:https://www.cnblogs.com/wells33373/p/6072186.html
Copyright © 2011-2022 走看看