有条件地仅触发 jQuery / JavaScript 中两个绑定的 mouseOver 事件之一答案

【问题标题】：Conditionally fire only one of two bound mouseOver events in jQuery / JavaScript有条件地仅触发 jQuery / JavaScript 中两个绑定的 mouseOver 事件之一
【发布时间】：2011-08-23 23:10:10
【问题描述】：

我有一张使用jQuery Maphilight 插件的美国地图（参见this Maphilight demo）。我的代码如下：

$('.map').maphilight();

我已将它与 jQuery qTip 插件结合使用。我将 qTip 工具提示设置为在用户将鼠标悬停在地图上的每个 <area> 上时显示。我的代码如下：

$('area').each(function() {
    $(this).qtip({
        content: $(this).attr('data'),
    });
});

因此，当用户移过每个<area> 时，都会出现“突出显示”和“工具提示”。

我也有一个传说。使用上面的 Maphilight 演示，图例将有粉红色、紫色、绿色和黄色。我想移过例如黄色图例键并突出显示所有黄色字段。

为此，我将每个状态 <area> 上的 class 属性设置为其实际颜色。在每个图例颜色<area> 上，我将class="color" 和myColor 设置为等于实际颜色。我有以下 JavaScript，根据 Maphilight documentation，它在每个 <area> 上模拟 mouseOver 以激活突出显示。

<area class="color" myColor="yellow">
$('.color').mouseover(function() {
    $('.' + $(this).attr('myColor')).mouseover();
});

$('.color').mouseout(function(e) {
    $('.' + $(this).attr(myColor)).mouseout();
});

但是，您可以想象，这也会针对该颜色的每个单一状态显示工具提示。绑定两个mouseOver事件，如何只激活一个？

这一定是一个常见的 jQuery 问题，肯定超出了这个特定场景的范围，但我不确定如何搜索它。每个 jQuery 插件中是否通常有一种方法可以让您模拟对特定选择的效果（即$('area#some_id')）？

【问题讨论】：

标签： javascript jquery map imagemap qtip

【解决方案1】：

看起来 maphilight 正在为其事件命名空间。所以，你应该能够做到这一点：

$('.' + $(this).attr(myColor)).trigger("mouseover.maphilight");

编辑：有关命名空间事件的信息：http://docs.jquery.com/Namespaced_Events

【讨论】：

这正是我想要的。谢谢！