首頁 > web前端 > js教程 > JavaScript使用focus()設定焦點失敗的解決方法_javascript技巧

JavaScript使用focus()設定焦點失敗的解決方法_javascript技巧

WBOY
發布: 2016-05-16 16:37:24
原創
2012 人瀏覽過

昨天修改機上盒上面的EPG頁面,遇到一個小問題。用戶購買遊戲時需要跳出購買確認對話框,對話框的預設焦點規定必須停留在「取消」按鍵上。很簡單的需求,使用JavaScript的focus()方法就可以實現了。簡單的程式碼範例如下:

document.getElementById("cancel").focus()
登入後複製

但是苦逼的是,機上盒真是個大坑。由於要相容於所有現存的機上盒型號,需要對8款機上盒進行適配。然後就出現問題了!一款中興B600的機上盒完全沒辦法將焦點設定到取消按鍵。以下是我的解決思路:

首先確認該機上盒是否支援getElementById()方法以及是否成功獲得了ID為「cancel」的元素:測試方法很簡單,直接另寫了一個

test

,然後在同樣的地方取得ID為「test」的元素,並進行了簡單的操作document.getElementById("test").innerHTML="Hello"
最後使用了「try...catch(e)...」捕捉「focus()」失敗的原因

try(){ 
<span style="white-space:pre"> </span>document.getElementById("cancel").focus() 
}catch(e){ 
<span style="white-space:pre"> </span>alert(e.name + ": " + e.what()); 
}
登入後複製

但是就是很奇怪!以上兩步驟的結果顯示該機上盒支援focus()和getElementById(),但就是無法設定焦點到彈出的對話框中。

前前後後折騰了一個多小時,最後大BOSS出現了,就簡單說了一句話就解決了這個問題!有可能要主動呼叫flur()將原來的焦點取消掉!

document.getElementById("purchase").flur()
登入後複製

然後就解決了這個問題。不得不感概!在解決這個問題的過程中,自己的思路其實還蠻正確的,但知識面顯然不夠。一般程式設計師和高階程式設計師的差距除了解決問題的思路方面,也有經驗和知識面的差距!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板