Input框防抖動

前端晉級攻城獅發表於2019-05-22

在input框輸入的時候，當我們監聽input事件的時候，由於input事件是一旦輸入框內容發生改變就觸發我們繫結的回撥函式，在實際當中我們往往會根據輸入框內容去傳送一些請求，這樣一旦改變就觸發無疑是耗時的，而且影響效能,這個時候，我們就可以使用防抖動。實現的大概思路就是我們可以自定義隔多長時間來觸發我們的處理操作(例如ajax請求資料等)

var timer = null
element.input = function () {
    clearTimeout(timer) // 每次進來的時候都將之前的清除掉，如果還沒到一秒的時候就將之前的清除掉，這樣就不會觸發之前setTimeout繫結的事件， 如果超過一秒，之前的事件就會被觸發下次進來的時候同樣清除之前的timer
    timer = setTimeout(function () {
        // 在這裡進行我們的操作  這樣就不會頻繁的進行我們這裡面的操作了
    }, 1000)
}
複製程式碼

相關文章