dojo连接mouseover和mouseout

Question

当设置onmouseover与onmouseout鼠标悬停的dojo连接,然后在鼠标悬停时添加内容时,dojo会onmouseout立即触发事件,因为有新内容.例:

dojo.query(".star").parent().connect("onmouseover", function() {
    dojo.query("span", this).addContent("<img src='star-hover.jpg'>");
}).connect("onmouseout", function() {
    dojo.destroy(dojo.query("img", this)[0]);
});

的parent()是<td>,和.star是一个跨度.我想在用户悬停表格单元格时添加悬停图像.只要光标没有悬停在图像上,它就会起作用,因为这会导致一些严重的闪烁.这是故意的吗？它有办法吗？

编辑:刚尝试了与jQuery类似的东西,它按预期工作(至少我期望它工作.)

$(".star").parent().hover(function() {
    $("span", this).append("<img src='star-hover.jpg'>");
}, function() {
    $("img", this).remove();
});

这将在悬停时显示图像,并仅在将光标移动到表格单元格外时删除.

Answer 1

它在您的示例中与jQuery一起使用的原因是因为.hover使用规范化的onmouseenter/onmouseleave事件.如果你要连接到那些,它将按预期在Dojo中工作.此外,Dojo的.hover模拟将是:

dojo.NodeList.prototype.hover = function(over, out){
    return this.onmouseenter(over).onmouseleave(out || over);
}

然后你就是:

dojo.query("...").hover(function(e){ .. }, function(e){ .. });

mouseeneter和mouseover之间的区别是你看到立即onmouseout射击的行为的原因.