1. 程式人生 > >關於IE10輸入框focus後觸發input事件的bug

關於IE10輸入框focus後觸發input事件的bug

工作中遇到的問題,謹記錄以作備忘!!!

問題描述

IE10 在頁面輸入框上同時綁定了input以及foucs事件,當觸發foucs事件的時候會觸發input事件,導致我的第一次搜尋無效。

注:本人只在IE8/IE10/Chrome等瀏覽器上進行測試,表現結果為:IE8、Chrome表現正常,IE10表現異常

暫時解決辦法

在一番搜尋之後,在這個異常反饋(注意這個連結得翻牆)中找到相同的表現,具體如下:

The JS code registers a listener on ‘input’ event for a <input type="text">.

What I find unexpected is that the event handler is triggered as soon as I focus the input field.

IE 11 triggers the handler when I either focus or leave (blur) the input field.
IE 10 triggers the handler only when I focus the input field.
IE 9, Google Chrome, Firefox and Opera do not trigger the handler unless the > user types something in the input or cuts/pastes in it.

這是給IE開發者提的反饋意見,回覆是:

Thank you for the feedback. This issue has been fixed in Microsoft Edge. We’re not presently working on feature bugs in Internet Explorer outside of security-related issues.
Best Regards,
The Microsoft Edge Team

簡而言之就是這是一個bug,會在Edge版本修復,同事在下面的建議中有這麼一段話:

Note, this bug ONLY occurs when the input element has its placeholder attribute assigned. If it does not, IE 10/11 behave correctly.

只有當輸入框上存在placeholder的情況下才會出現如此問題,因此專案中如果不是特別依賴placeholder可以將其暫時去掉。另外如果想要實現placeholder效果,可以使用另外的方式實現,這裡不作講述。