Проблема порядка табуляции в IE с начальным выбором поля в Javascript в форме - PullRequest
Новая
       13

Проблема порядка табуляции в IE с начальным выбором поля в Javascript в форме

3 голосов
/ 10 марта 2009

Я пытаюсь добиться следующего поведения в html: пользователю предоставляется форма, включающая несколько текстовых полей. Поля заполнены значениями по умолчанию, но во многих случаях пользователь захочет ввести свои собственные. Когда страница загружается, значение в первом поле выбирается, поэтому пользователь может либо заменить его, просто начав вводить текст и перейти к следующему полю, либо просто оставить его и выйти из него. Вот урезанный пример того, что у меня есть: 

<html>
    <body onload="document.getElementById('helloField').select()">
        <form>
            <input id="helloField" value="hello"/><br/>
            <input value="goodbye"/><br/>
            <input type="submit" value="Submit"/>
        </form>
    </body>
</html>

Это работает в Chrome (и Firefox, я думаю, но у меня его здесь нет). В IE поле выбирается так, как задумано, но когда пользователь нажимает вкладку, браузер перемещается в свою адресную строку, а не в поле до свидания. Если я заменю выбор с простым фокусом, как 

<body onload="document.getElementById('helloField').focus()">

табуляция в порядке во всех браузерах, но это не то, что я хочу. Я хочу, чтобы пользователь мог сразу же начать печатать, чтобы заменить значение по умолчанию.

У кого-нибудь есть идеи?

Спасибо.

Ответы [ 2 ]

6 голосов
/ 10 марта 2009

Фокус, , затем выберите.

Также рассмотрите возможность помещения кода в блок скрипта сразу после рассматриваемого ввода. Если у вас есть куча изображений на странице, то document.onload может сработать намного позже, и последнее, что вам нужно, это набирать текст в поле ввода, когда onload срабатывает и захватывает ваш фокус (заставляя вас удалять коробка). 

<input id="helloField" value="hello"/><br/>
<script type="text/javascript">
    var hello= document.getElementById('helloField');
    hello.focus();
    hello.select();
</script>
1 голос
/ 10 марта 2009

Попробуйте установить порядок табуляции полей с помощью tabindex: 

<html>
    <body onload="document.getElementById('helloField').select()">
        <form>
            <input id="helloField" value="hello" tabindex="1" /><br/>
            <input value="goodbye" tabindex="2" /><br/>
            <input type="submit" value="Submit" tabindex="3" />
        </form>
    </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...