dojo連接鼠標懸停和鼠標移動

當設置dojo連接到onmouseover和onmouseout，然後在mouseover上添加內容時，dojo會立即觸發onmouseout事件，因爲有新內容。例如：dojo連接鼠標懸停和鼠標移動

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(); 
});

徘徊時，這將顯示圖像，並且只刪除在表格單元格外移動光標時。

來源

2010-04-13 peirix

我寧願將圖像放在所有span.star節點內，然後在鼠標結束時向節點添加一種「.hovered」類，並添加css規則以僅在span.star內顯示圖像'td.hovered'下。 – Kniganapolke 2010-04-14 11:08:47

當然，但有些情況下人們希望在懸停狀態下追加元素。當然，這不可能是正確的行爲？ – peirix 2010-04-14 14:07:34

它在你的例子中使用jQuery的原因是因爲.hover使用規範化的onmouseenter/onmouseleave事件。如果你想連接到這些，那麼它將按照預期在Dojo中工作。此外，.hover對Dojo的模擬將是：

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

，那麼你會只是：

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

mouseeneter和鼠標懸停之間的差異爲什麼你看到一個立即的onmouseout射擊的行爲。

來源

2010-04-16 13:12:21 dante

dojo連接鼠標懸停和鼠標移動

回答

相關問題