SVG上的.mouseover()事件表现得很奇怪

Question

链接到jsfiddle:http://jsfiddle.net/crismanNoble/gqFdH/2/

基本上svg不会触发.mouseout事件而不断改变颜色.

$(function() {
    $(".icon")
    .mouseover(function() {
               var colors = ["#6F216C", "#F34B0D", "#C50102", "#5DA537", "#F1D81B"];
               var pick = Math.floor(Math.random()*5);
               var color = colors[pick];
               $(this).children().css('fill',color); 
               })
    .mouseout(function() {
              $(this).children().css('fill','black');
    });
});

Answer 1

使用.mouseenter()和.mouseleave()替代.

小提琴:http://jsfiddle.net/gqFdH/5/

在不访问API文档的情况下,我怀疑.mouseover会在鼠标移动(而不仅仅是移动)区域时触发.但我可以做到这一点.我知道进入和离开工作.