focus filtering select on page load

2019-09-01 13:46发布

问题:


why does the following code don't focus the filteringselect?

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript" src="http://yandex.st/dojo/1.6.0/dojo/dojo.xd.js" djConfig="parseOnLoad: true"></script>
    <style type="text/css">
            @import "http://yandex.st/dojo/1.6.0/dijit/themes/claro/claro.css";
    </style>
    <script type="text/javascript">
    <!--
    dojo.require("dijit.form.FilteringSelect");

    dojo.addOnLoad(function(){
        dijit.byId('dept').focus();
    });

    -->
    </script>
    </head>
    <body class="claro">
    <select name="dept" id="dept" dojoType="dijit.form.FilteringSelect" >
        <option value=""></option>
        <option value="test">test</option>
        <option value="test1">test1</option>
    </select>
    </body>
    </html>

I tried it with ie7 and firefox 3/4 - it works.
but it fails in ie8 :-(
may this be a dojo bug - or am I doing something wrong?
when does dojo.addOnLoad() fire? after the DOM is ready, or after all widgets have properly been initalized?
regards
gerhard

回答1:

it's very intresting bug.. i have made small research and found solution. maybe it looks like a "dirty hack", but still it can help you.

you can simply add timeout:

dojo.addOnLoad(function () {
        setTimeout(function () { dijit.byId('dept').focus() }, 400);
});

Not noticeable by a user but it gives IE a moment to breathe.

It's work in IE8 for me



回答2:

I'm not sure what browsers fully support this, but you could try:

<select name="dept" id="dept" dojoType="dijit.form.FilteringSelect" autofocus>

Also, I don't see why you're using an Import statement if you could just use the link tag:

Before:

<style type="text/css">
    @import "http://yandex.st/dojo/1.6.0/dijit/themes/claro/claro.css";
</style>

After:

<link rel="stylesheet" type="text/css" href="http://yandex.st/dojo/1.6.0/dijit/themes/claro/claro.css">