zoukankan      html  css  js  c++  java
  • 绑定事件的方式

    bind,绑定方式,

    $("#dv").bind({
        "click":function(){},
        "mouseover":function(){}
    })

     * delegate:
    * 参数:3个
    * 1.要绑定事件的元素---p
    * 2.要绑定的事件的名字---click
    * 3.绑定事件的处理函数---匿名函数

    $("#dv").delegate("div","click",function () {
    alert("我被点了");
    });

    on,绑定的方式

     * on方法: 两个参数:1事件的名字,2事件处理函数
     * on方法:三个参数: 1,事件的名字, 2.要绑定事件的元素--p,3事件处理函数
     * on是父级元素调用,目的:为子级元素去绑定事件
    $("#btn").on("click",function () {
        //创建p添加到div中
        $("#dv").append($("<p>这是一个p</p>"));
        //为div中的p标签绑定事件
        // $("#dv").html("<p>这是另一个p标签</p>")
        /*
       
        *
        * */
        $("#dv").on("click","p",function () {
            alert("我被点了");
        });
    });
    
    

    bind,解绑

    /解绑事件
    // $(function () {
    // //第一个按钮bind绑定事件
    // $("#btn1").bind("click",function () {
    // alert("我又被点了");
    // });
    // //第二个按钮unbind解绑事件
    // $("#btn2").bind("click",function () {
    // $("#btn1").unbind("click");//解绑事件的方法
    // });
    // });
    
    
     //为div和p都绑定点击事件
    // $("#dv>p").click(function () {
    // alert("p被点了");
    // });
    $("#dv").delegate("p","click",function () {
    alert("p被点了");
    });
    $("#dv").click(function () {
    alert("div被点了");
    });
    $("#btn1").click(function () {
    // $("#dv").off("click");
    //下面的代码是把子级元素的点击事件解绑了,父级元素的点击事件还存在
    //$("#dv").off("click","**");
    $("#dv").off();//移除父级元素和子级元素的所有的事件
    });
    //如果说父级元素和子级元素都是通过正常的方式绑定事件,如果通过off解绑的时候,父级元素的事件解绑了,子级元素的事件没有解绑
    //但是:如果子级元素是通过父级元素调用delegate的方式绑定的事件,父级元素使用off方式解绑事件,这个时候父级元素和子级元素的相同的事件都会被解绑



    事件的触发
       //点击第二个按钮调用第一个按钮的点击事件---触发第一个按钮的点击事件
                $("#btn2").click(function () {
                    //触发事件--3三种方式
                    //$("#btn1").click();
                    //trigget()方法中需要写上触发事件的名字
                    //$("#btn1").trigger("click");//触发事件
                    $("#btn1").triggerHandler("click");//触发事件
                });
    
    
    
     
     
  • 相关阅读:
    C#委托
    资源推荐 五个常用MySQL图形化管理工具
    C#数组
    虚方法与多态
    How to connect to MySQL database from Visual Studio VS2010 – problems with NET connectors
    2021秋软工实践第二次结对编程作业
    2021秋软工实践第一次个人编程作业
    低维数据可视化
    2021秋季软件工程实践总结
    2021秋软工实践第一次结对编程作业
  • 原文地址:https://www.cnblogs.com/hehedaaa/p/10925136.html
Copyright © 2011-2022 走看看