關於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
效果,可以使用另外的方式實現,這裡不作講述。