Question

Refer to this link (open firebug)。我有一个“下拉”html元素，它有一个事件观察者正在寻找鼠标悬停。它正在工作，但是当你将鼠标悬停在其中的其他元素上时，它会不断触发鼠标悬停事件。我猜这是因为冒泡。

有没有办法让它在初始鼠标悬停时触发事件？我想要它做一个效果，这是打破效果。我相信这只是我不做的基本事情。

感谢您的帮助。

Answer 1

想出来。使用最新版本的原型，您可以创建onmouseenter和onmouseleave事件，只触发一次。感谢Protoype Google小组。

Answer 2

我相信您可能想要使用Event.stop(event)

文档：Prototype: Event.stop

Answer 3

您应该只观察具有dropdown_label类的元素的鼠标悬停事件。

鉴于你的HTML：

<div class="dropdown" id="">
    <div class="dropdown_label">About <strong>Us</strong></div>
    <div class="dropdown_content">
        <ul>
            <li><a href="#">Contact</a></li>
            <li><a href="#">Facts and Figures</a></li>
            <li><a href="#">Offices</a></li>
        </ul>
    </div>
</div>

下拉标签和下拉内容都包含在下拉列表中。听起来你只想在用户将鼠标悬停在下拉标签上时执行效果。

修改

某些未经测试的JavaScript可能有效，也可能无效

$$('DIV.dropdown').each(function(dd) {

  var dd_list = dd.down('.dropdown_content');

  dd.select('DIV.dropdown_label').each(function(ddl) {
    ddl.observe('mouseover', function(event){
      console.log('mouseover');
      dd.addClassName('dd_open');
    });
  });

  dd.observe('mouseout', function(event){
    console.log('mouseout');
    dd.removeClassName('dd_open');
  });

ProtoypeJS：只在鼠标悬停时反应一次

3 个答案:

修改