3 回答

TA貢獻1817條經驗 獲得超14個贊
您應該調用setTimeout內部事件處理程序,如下所示:
document.getElementById("test1").addEventListener("mouseout", mouseOut);
function mouseOut() {
setTimeout(mouseOut2, 10000);
}
function mouseOut2() {
document.getElementById("test2").style.opacity = "1";
document.getElementById("test2").style.visibility = "visible";
}

TA貢獻1895條經驗 獲得超3個贊
SetTimeout 應該在 mouseOut 里面
document.getElementById("test1").addEventListener("mouseover", mouseOver);
document.getElementById("test1").addEventListener("mouseout", mouseOut);
function mouseOver() {
document.getElementById("test2").style.opacity = "0";
document.getElementById("test2").style.visibility = "hidden";
}
function mouseOut() {
setTimeout(()=>{
document.getElementById("test2").style.opacity = "1";
document.getElementById("test2").style.visibility = "visible";
}, 6000);
}
<body>
<img src="images/1.jpg" alt="some_text" id="test1" style="height: 450px; width: 300px;">
<img src="images/1.jpg" id="test2" alt="some_text" style="height: 450px; width: 300px;">
</body>

TA貢獻1795條經驗 獲得超7個贊
由于您綁定mouseOut為相應事件的事件處理程序,它仍將被執行。您setTimeout添加的只會再調用mouseOut一次,與鼠標事件無關。
如果您想延遲處理鼠標移開事件時發生的事情,請執行以下操作:
function mouseOut() {
setTimeout(function () {
document.getElementById("test2").style.opacity = "1";
document.getElementById("test2").style.visibility = "visible";
}, 10000);
}
但是請注意,這可能不是那么用戶友好。用戶可能希望該行為與他們的鼠標移動有關,但現在連接丟失了——肯定有 10 秒的超時。
添加回答
舉報