Question

我有一个设置，其中我有一个元素网格，当我翻转每个元素时，弹出窗口显示为高级工具提示。我首先检查弹出窗口是否需要跟随moused over元素鼠标位置，如果是，我使用mousemove事件。我先停止观察，以防之前有一套，然后我开始观察。我是否真的需要这样做，或者原型足够聪明，不能在同一元素上添加重复事件。

 show:function(param){
      if(this.isFollow){
        $(param.target).stopObserving('mousemove', this.onMouseMove);
        $(param.target).observe('mousemove', this.onMouseMove);
      }
},

//param.target is the element that is being rolled over. I pass this in to my show method to then find its x and y position.

 onMouseMove:function(event){
    var xPos = Event.pointerX(event);
    var yPos = Event.pointerY(event);
    _self._popup.setStyle({left: xPos + 10 + "px", top:yPos + 10 + "px"});
 }

第二个问题。当我将鼠标快速移动到元素上时，跟在鼠标后面的弹出窗口有时会滞后，鼠标会越过弹出窗口阻碍鼠标悬停事件发生在它下面的元素上。我认为这是mousemove的本质，因为它的渲染速度不够快。我应该使用setTimeout或类似的东西而不是mousemove，以防止这种滞后。

Answer 1

1）不，Prototype不会设置两次相同的事件处理程序。只有当你在线处理你的处理函数（即element.observe('click', function(){…})）时才会发生这种情况，因为处理程序每次都会被发送一个新创建的函数，而不是完全相同的函数实例。
但在您的情况下，您指的是onMouseMove函数，Prototype将检查该特定元素上是否已为该特定事件注册该特定函数。如果是，则不会再次注册。

2）你无法避免快速鼠标移动的滞后，没有。浏览器不会足够快地发送mousemove个事件。您可以使用计时器，但我可能会尝试为所有网格元素的父元素（或者甚至可能mousemove本身）注册一个document处理程序，并使用X / Y坐标找出显示工具提示的grid-element。然后，您不必为每个元素设置事件处理程序。即如果网格是标准表，我会在<table>元素本身而不是每个<td>上监听事件。特别是如果你仍然想要实现一个计时器，我认为，在一个地方处理所有事情会更容易（否则，计时器可能会意外地执行你已经被淘汰的某个元素，并且你的工具提示会闪烁如果你一次只想要一个工具提示，那么在一个地方管理它会更容易。）

原型中的重复事件

1 个答案: