使用Javascript註冊`keydown`事件後Textarea滯後

如何將一堆代碼附加到onkeydown事件，但繼續快速而清晰地輸入文本到textarea？除了一些IF聲明之外，任何事情似乎都會顯着減慢它的速度。使用Javascript註冊`keydown`事件後Textarea滯後

編輯：我應該添加（不能相信我忘了！），這不會影響桌面瀏覽器。這主要是iPhone Safari的一個問題。其他移動瀏覽器也可能會受到影響，但我們專注於iPhone Safari，因爲它執行JS最好（AFAIK）

2009-01-17 aditya

嗯，一種方法是不使用onkeydown，而是使用計時器。你可以設置一個間隔運行一個函數來檢查TextArea的內容並在那裏運行你的邏輯。看來它會通過大部分的開銷。無論如何，給它一個鏡頭，我認爲這可能會有所幫助。

這裏是你將如何使用它：

// First param is the function to call, second is 
// time interval in miliseconds 
var timer = setTimeout(checkTextArea(), 5000); 

function checkTextArea() { 
    var text = document.getElementById("textarea").value; 
    // logic... 
    timer = setTimeout(checkTextArea(), 5000); // we loop it back to 
               //the function with the timer 
}

來源

2009-01-17 06:50:23 David

考慮您對本所專注於iPhone訪問編輯...

的iPhone真的只是沒有那麼大的權力吧。你會更好只是使用onchange或onblur，而不是onkeydown。

戴夫的回答另外一個辦法是等待用戶暫停（如5秒）：

var textarea = document.getElementById('textarea'); 

function checkTextArea() { 
    if (textarea.value /* ... */) { 
    /* ... */ 
    } 
} 

textarea.keyDownTimeout = null; 
textarea.onkeydown = function() { 
    if (textarea.keyDownTimeout) clearTimeout(textarea.keyDownTimeout); 
    textarea.keyDownTimeout = setTimeout(checkTextArea, 5000); 
};

這應該設置定時器與第一的keydown，停止和重新創建定時器爲每個連續keydown。最後在用戶停止輸入5秒後再打電話。

另外，請注意在checkTextArea之後缺少括號。這將給setTimeout函數的參考與其return。

您也可以在功能設置這使它更易於使用多個元素：

function setPauseTimer(element, timeout, callback) { 
    var timer = null; 
    element.onkeydown = function() { 
    if (timer) clearTimeout(timer); 
    timer = setTimeout(function(){ callback(element); }, timeout); 
    }; 
} 

function checkTextArea(textarea) { /* moved from global to argument */ 
    if (textarea.value /* ... */) { 
    /* ... */ 
    } 
} 

setPauseTimer(document.getElementById('textarea'), 5000, checkTextArea);

來源

2009-01-17 07:37:17

也許你可以張貼「一串代碼」，我們可以討論是否有一些在那裏重構（在用計時器複雜化之前）。看起來你可能會先跳到次要優化。

來源

2009-01-17 07:55:25 dkretz

不幸的是，我不能，因爲它是公司政策的一部分。這使問題變得複雜，是的，但我希望有人可能找到了一個通用的解決方案。 – aditya 2009-01-17 08:26:01

我曾想過計時器的方法。我相信setTnterval會好於setTimeout，但這似乎不是最佳解決方案，不是嗎？

來源

2009-01-17 08:30:29 aditya

使用Javascript註冊`keydown`事件後Textarea滯後

回答

相關問題