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!。