• jquery bind函数传递事件数据


    1.  mouseover,mouseout事件小技巧

       

    $('#foo').bind('mouseenter mouseleave', function() {
      $(this).toggleClass('entered');
    });

            通过bind函数同时绑定鼠标移入,移出事件,可以简单实现鼠标移入移出处理。

    2.    Passing Event Data(传递事件数据)

    可选的eventData参数不常用。当提供时,这种参数允许我们给处理函数传递额外的信息。一个方便的使用这个参数来解决由于闭包造成的问题。例如,假设我们有两个事件处理函数都引用了相同的外部变量:

    1
    2
    3
    4
    5
    6
    7
    8
    var message = 'Spoon!';
    $('#foo').bind('click', function() {
    alert(message);
    });
    message = 'Not in the face!';
    $('#bar').bind('click', function() {
    alert(message);
    });

    由于两个事件处理函数的闭包中,都引用了 message,所以,当事件被触发时,这两个事件处理都会显示 Not in the face!,因为变量的值已经改变了。为了避免这个问题,我们可以使用 eventData 来传递信息:

    1
    2
    3
    4
    5
    6
    7
    8
    var message = 'Spoon!';
    $('#foo').bind('click', {msg: message}, function(event) {
    alert(event.data.msg);
    });
    message = 'Not in the face!';
    $('#bar').bind('click', {msg: message}, function(event) {
    alert(event.data.msg);
    });

    这一次该变量没有提供给处理函数;相反,变量通过传递给eventData ,所以就可以在事件绑定的时候进行赋值操作。 第一个处理程序,现在将显示Spoon!而第二个会提醒Not in the face!

  • 相关阅读:
    为什么使用GitHub
    java学习笔记
    mysql 内置功能 存储过程 创建有参存储过程
    mysql 字符串类型 char varchar
    前端 HTML 注释
    mysql 内置功能 存储过程 删除存储过程
    前端开发 目录
    mysql 内置功能 存储过程 创建无参存储过程
    mysql 内置功能 存储过程 目录
    mysql 内置功能 存储过程介绍
  • 原文地址:https://www.cnblogs.com/ssyz1988/p/3725931.html
Copyright © 2020-2023  润新知