博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
事件(二)——Jquery事件模型
阅读量:6288 次
发布时间:2019-06-22

本文共 1040 字,大约阅读时间需要 3 分钟。

  • bind()方法    
与W3C标准事件API十分相似,除了名称上的不同以外,唯一差别就是去掉了useCapture参数,并且去掉了事件名称中的on前缀。示例代码如下:
$(document).bind(
    "ready",
    function() {
        $("div").bind(
            "mouseover",
            function() {
                $(this).addClass("tmpExampleOver");
        }
        );
        $("div").bind(
            "mouseout",
            function() {
                $(this).removeClass("tmpExampleOver");
        }
        );
    }
);
  • 使用单独的事件方法绑定事件
与传统的时间模型不同,Jquery的事件名称没有on前缀,而且可以将多个相同类型的时间挂钩到同一个元素上。示例代码如下:
$(document).ready(
    function() {
        $("div").mouseover(
            function() {
                $(this).addClass("tmpExampleOver");
        }
        );
        $("div").mouseout(
            function() {
                $(this).removeClass("tmpExampleOver");
        }
        );
    }
);
还有一些常用的事件挂钩模式,如hover()方法同时挂钩一个mouseover和mouseout事件,toggle()方法可以挂钩多个事件处理函数,以便交替在不同函数间处理事件。
  • 触发事件
使用Jquery的事件API可以将事件处理函数绑定要事件,实际上这些函数可以不依赖任何实际事件的发生而单独触发。从而允许你重用绑定的事件函数来实现其他功能。Jquery甚至还允许将参数传递给事件处理函数。示例程序演示trigger()方法:
$(document).ready(
    function() {
        $("input").focus(
            function() {
                $(this).addClass("tmpFocused");
        }
        );
        $("input").blur(
            function() {
                $(this).removeClass("focus");
        }
        );
        $("input").trigger("focus");
    }
);

转载于:https://www.cnblogs.com/xiaowangba/archive/2012/09/20/6314786.html

你可能感兴趣的文章