首頁猿問使用setTimeout(fn,...

使用setTimeout(fn, 0)出現的一個奇怪的現象

JavaScript

慕森王 2019-03-19 17:13:55

代碼html未使用setTimeout函數 <input type="text" id="input" value=""> 使用setTimeout函數 <input type="text" id="input" value=""> jsdocument.querySelector('#one input').onkeydown = function() { document.querySelector('#one span').innerHTML = this.value;}document.querySelector('#second input').onkeydown = function() { setTimeout(function() { document.querySelector('#second span').innerHTML = document.querySelector('#second input').value; }, 0);}現象

查看完整描述

7 回答

慕桂英546537

TA貢獻1848條經驗獲得超10個贊

onkeydown是在用戶按下鍵盤按鍵時觸發，之后是改變input的值，然后觸發onkeyup。
所以第一種情況下，回調函數里，span元素設置的是未改變的input的value值。第二種情況是setTimeout把修改span元素的操作放在本次同步事件的后面，而這時input的值已經改變了。
如果要達到一樣的效果，可以用onkeyup代替。
demo

反對回復 2019-03-25

慕無忌1623718

TA貢獻1744條經驗獲得超4個贊

這里其實和 setTimeout 關系不大，是onkeydown 事件的關系，

首先你要了解這個事件

onkeydown 屬性在用戶（在鍵盤上）按鍵時觸發
onkeypress 事件會在鍵盤按鍵被按下并釋放一個鍵時發生。
onkeyup 事件會在鍵盤按鍵被松開時發生。

當用戶在第一次按下鍵的時候其實值是空，你可以 onkeydown 事件中打印下 this.value;

反對回復 2019-03-25

烙印99

TA貢獻1829條經驗獲得超13個贊

keydown 換成 keyup 就可以了，

原因：keydown->value 改變->keyup（超過一定間隔沒有 keyup ，會繼續 keydown ）,setTimeout 有個最小間隔，導致捕獲到了改變后的 value ,沒有setTimeout 的時候，直接捕獲的是改變前的value,測試戳 demo

反對回復 2019-03-25

喵喔喔

TA貢獻1735條經驗獲得超5個贊

通俗點說，
你輸入的內容，并不是立刻賦值到this.value的，他存在一個棧順序。
但用了setTimeout(fn, 0)以后，fn的代碼會放到本次執行棧的最后去執行。

反對回復 2019-03-25

ibeautiful

TA貢獻1993條經驗獲得超6個贊

首先，延遲設置為0，也不是真正意義上的無延遲;其次，執行到 setTimeout 會加入一個單獨的隊列中執行，這個隊列的任務在主隊列沒有執行完畢時都不會去執行

反對回復 2019-03-25

至尊寶的傳說

TA貢獻1789條經驗獲得超10個贊

document.querySelector('#one input').onkeydown = function() {

alert('one');

document.querySelector('#one span').innerHTML = this.value;

}

document.querySelector('#second input').onkeydown = function() {

alert('second1');

setTimeout(function() {

alert('second2');

document.querySelector('#second span').innerHTML = document.querySelector('#second input').value;

}, 0);

}

中間加個alert斷點就知道了

1.input在鍵盤按下的時候，onkeydown先執行，再有值，獲取不到最后輸入的值

2.input在鍵盤按下的時候，onkeydown也是先執行，然后觸發一個異步setTimeout，值出現了之后再執行異步的setTimeout，所以能夠獲得最后輸入的值。

onkeydown改為onkeyup就可以解決，因為onkeyup是放開按鍵的時候觸發的，所以會先有值先執行onkeyup

反對回復 2019-03-25

7 回答
0 關注
738 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

使用setTimeout(fn, 0)出現的一個奇怪的現象

使用setTimeout(fn, 0)出現的一個奇怪的現象

7 回答

添加回答