在 IE 中使用 iframe 有可能發生無法輸入文字的情況
可考慮在使用後清除並移除 iframe 來避免此問題的發生
問題徵兆
筆者 angular 1.x SPA 專案中發生一個很奇怪的事情，就是用戶在 IE11 環境中登入系統後，在查詢框中會發生「無法輸入文字」的情況，跡象如下：
- 可以點選並 focus 到輸入框
- 無游標出現，且在輸入框中無法輸入文字
- 此情境在 chrome 及 firefox 都正常運作
但是一直無法在開發環境重現，而本機與正式環境的差異在於是否使用 GOOGLE reCAPTCHA 對登入行為驗證，所以推論是 reCAPTCHA 造成的問題，但更精準的說法是 reCAPTCHA 中 iFrame 造成的問題。
排除方式
參考 IE 9 and IE 10 cannot enter text into input text boxes from time to time 文章後發現確實是 iFrame 造成此問題 ，因此筆者嘗試在登入後執行以下列語法清空 iframe 後就把這個問題解決了，特此發一篇文章來記錄一下這個詭異的情況。
$('.reCAPTCHA iframe').empty().remove();
另外筆者也有遇到跟 iframe 完全沒有關係的 IE 11 無法輸入文字的情境，此時可以考慮讓所有輸入框在 focus 時選取文字以進入編輯，以此排除無法輸入文字的窘境。
$("input[type='text']").each(function () {
$(this).focus(function () {
$(this).select();
});
});
希望此篇文章可以幫助到需要的人
若內容有誤或有其他建議請不吝留言給筆者喔 !
