zoukankan      html  css  js  c++  java
  • jQuery 移除事件与模拟事件

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Page Title</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" type="text/css" media="screen" href="main.css">
        <script src="jquery-3.3.1.min.js"></script>
    </head>
    <body>
        <button id="test">?</button>
        <button id="del">del</button>
        <button id="simulation">simulation</button>
        <button id="data">data</button>
        <script>
            $(function(){
                $("#test").bind("click.ns",func1=function(){
                    console.log(1);
                }).bind("mouseover.ns",func2=function(){
                    console.log(2);
                }).bind("click",func3=function(){
                    console.log(3);
                });
                //bind方法实际上可以同时绑定多个事件类型给一个函数
                //用命名空间规范事件类型
                //注意第一个与第三个,对于相同的事件名称用不同的命名空间执行方法进行按需调用
                $("#del").bind("click",function(){
                    $("#test").unbind(".ns",func1);//移除ns空间下的事件
                    $("#test").unbind("click",func1);//移除点击事件中的func1
                    //当不写参数时,即移除其所有绑定事件
                })
    
                //.trigger("click!"): 匹配所有没有被规范入命名空间的click事件
                // jQuery提供了一个一次性的使用方法,one(),只会触发一次,然后就被移除
    
                // 模拟操作,如模拟用户的点击
                $("#simulation").mouseover(function(){
                $("#simulation").trigger("click");//也可直接.click()
                });
                $("#simulation").click(function(){
                    console.log("success simulation");
                })
                // trigger()方法能够触发自定义的事件,如在bind中设置触发事件为blabla,可以用.trigger("blabla")模拟这个事件
                //传递数据
                $("#data").bind("sp",function(event,argu1,argu2){
                    $("#data").parent().append("<p>"+argu1+argu2+"</p>");
                })
                $("#data").trigger("sp",["testtext1","testtext2"]);
            })
            
        </script>
    </body>
    </html>

     3.30补充:使用trigger()方法,会触发浏览器本身的默认操作,如$("input).trigger("focus"),会同时使input元素得到焦点(浏览器的默认操作),

    如果不想执行浏览器默认操作,可使用triggerHandler()方法

  • 相关阅读:
    【2】Java包装类
    【1】Java异常
    【10】Java多态:内部类
    【9】Java多态:接口
    【8】Java多态:抽象类(abstract关键字)
    【7】Java多态:向上转型、向下转型、instanceof运算符
    【6】Java单例模式
    元素定位工具:Chrome浏览器ChroPath插件
    linux添加环境变量
    php导出数据到多个csv并打包压缩
  • 原文地址:https://www.cnblogs.com/linbudu/p/10601777.html
Copyright © 2011-2022 走看看