Wednesday, August 6, 2008

Focus 游標


Reference here -> http://blog.miniasp.com/?tag=/form



我們常會使用 element.focus() 方法,讓鍵盤游標停留在某個欄位上。例如說「會員登入」頁面開啟時,鍵盤輸入的游標就直接停在「帳號」欄位上,讓頁面開啟來後就可以直接輸入帳號。


但是當我畫面上的表單元素很多時,我會動態的將某些欄位隱藏,導致程式在執行 focus() 方法時會出現「控制項不可見、未啟動或無法接受焦點,因此無法將焦點移到控制項上。」的 JavaScript 錯誤。


例如說下面的 HTML:



html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="tw">

<head>

    <title>測試在 display:none 下的元素</title>

    <script type="text/javascript">

    window.onload = function ()

    {

        txtUsername = document.getElementById('username');

        txtUsername.focus()

    }

    </script>

</head>

<body>

    <form>

        <div style="display:none;">

            <input type="text" id="username" name="username" value="" />

        </div>





    </form>

</body>

</html>


No comments:

Post a Comment