javascript - jQuery 如何影响 mouseOver 上的单个元素

Question

由于我还在学习中，这个问题可能看起来很容易回答，但我仍然需要问。

我需要如何更改此脚本，使其不会显示所有工具提示？

现在发生的情况是，每当我将鼠标悬停在 .pink-nose a 上时，所有 .tooltip 都会同时淡入

    $(function(){
        var pn = $('.pink-nose a')
        var tp = $('.pink-nose .tooltip')

        tp.css({'display':'none'})
        pn.mouseover(function(){
            tp.fadeIn()            
        })
    })

感谢您提前提供的帮助

Answer 1

您应该从 this (鼠标悬停在其上的元素)开始，然后遍历到其相关的工具提示，而不是在处理函数中使用 tp。像这样的事情:

$(function(){
    $('.pink-nose .tooltip').hide();

    $('.pink-nose a').mouseover(function(){
        $(this).parents('.pink-nose:first').find('.tooltip').fadeIn();
    })
})

确切的遍历将取决于标记的结构，请查看 jQuery documentation for Traversing找出最有效的方法。