jquery - 仅限当前元素而不是父元素

Question

我试图只将边框添加到我的鼠标所在的元素,但我的代码也是为其父元素添加边框,

我的代码:

jQuery('body').mousemove(function(e){   
var el = e.target;
        jQuery(el).hover(function(){
            jQuery(this).css('outline','solid 2px #000');
        },function(){
            jQuery(this).css('outline','');
        });
});

在这里小提琴:http://jsfiddle.net/howtoplease/gk8t7/

Answer 1

主要问题是使用.hover..hover使用事件mouseenter和mouseleave.mouseleave当您输入子元素时,不会在父元素上触发,因此大纲将一直保留,直到您"离开"父元素和所有子元素.此外,您需要阻止mouseover孩子传播到父母.

//jQuery('body').mousemove(function(e){ 
    //var el = e.target;
    jQuery('div').mouseover(function (e) {
        e.stopPropagation();
        jQuery(this).css('outline', 'solid 2px #000');
    }).mouseout(function () {
        jQuery(this).css('outline', '');
    });
//});

http://jsfiddle.net/gk8t7/9/

另外,我不太明白你为什么使用它body mousemove,这是一个调试工具,你不知道你想要定义哪些元素？