Как вы можете установить фокус на элемент ввода HTML, не имея всего HTML? - PullRequest
Новая
       16

Как вы можете установить фокус на элемент ввода HTML, не имея всего HTML?

0 голосов
/ 01 мая 2009

Сначала фон: Я работаю в Tapestry 4, поэтому HTML для любой данной страницы сшит из разных кусочков HTML, разбросанных по всему приложению. Для компонента, над которым я работаю, у меня нет тега <body>, поэтому я не могу присвоить ему атрибут onload.

Компонент имеет элемент ввода, который нуждается в фокусе при загрузке страницы. Кто-нибудь знает способ установить фокус на ввод файла (или любой другой ввод текста) при загрузке страницы без доступа к тегу body?

Я пытался вставить скрипт в тело как
document.body.setAttribute('onload', 'setFocus()')
(где setFocus - функция, устанавливающая фокус на элемент ввода файла), но это не сработало. Я не могу сказать, что был удивлен этим.

РЕДАКТИРОВАТЬ:
Как уже было сказано, мне действительно нужно сделать это с компонентом страницы. Я закончил тем, что добавил к файлу, который мы используем, чтобы сделать акцент на первом редактируемом и видимом вводе на странице. При исследовании этой проблемы я не обнаружил никаких проблем с безопасностью.

Ответы [ 8 ]

3 голосов
/ 08 апреля 2011 
<script>
window.onload = function()  {
     document.getElementById('search_query').select();
    //document.getElementById('search_query').value = ''; 
    // where 'search_query' will be the id of the input element
};
</script>

должно быть полезно, я думаю !!!

1 голос
/ 01 мая 2009

Я думаю, у вас есть фундаментальная проблема с инкапсуляцией. Хотя в большинстве случаев вы можете присоединить обработчик событий к событию onload - см. Джон Резиг http://ejohn.org/projects/flexible-javascript-events/, чтобы узнать, как это сделать, setFocus должен управляться компонентом страницы, поскольку у вас не может быть двух компонентов на вашем страница, требующая, чтобы они получали фокус при загрузке страницы.

1 голос
/ 01 мая 2009

вы можете дать окну обработчик загрузки 

window.onload = setFocus;
1 голос
/ 01 мая 2009

Это хорошо сработало для меня: 

<script>
  function getLastFormElem(){
    var fID = document.forms.length -1;
    var f = document.forms[fID];
    var eID = f.elements.length -1;
    return f.elements[eID];
  }
</script>


<input name="whatever" id="maybesetmaybenot" type="text"/>
<!-- any other code except more form tags -->

<script>getLastFormElem().focus();</script>
0 голосов
/ 05 мая 2009

Решение Scunliffe имеет преимущество в удобстве использования.

Когда скрипты страницы загружаются медленно, вызов focus () из события «onLoad» делает очень неприятный «скачок» страницы, если пользователь прокручивает страницу. Так что это более удобный подход: 

<input id="..."></input>
... really small piece of HTML ...
<script>getTheDesiredInput().focus();</script>
0 голосов
/ 04 мая 2009

С jQuery можно сделать так: 

$(function() {
    $("input:file").eq(0).focus()
})

С простым javascript можно было бы сделать так: 

var oldWindowOnload = window.onload; // be nice with other uses of onload 
window.onload = function() {
    var form = document.forms[0];
    for(i=0; i < form.length; i++) {
        if (form[i].type == "file") {
            form[i].focus();
        }
    }
    oldWindowOnload();
}

Для более сложного решения с простым javascript см. Установите Фокус на Первый ввод на веб-странице в CodeProject.

0 голосов
/ 01 мая 2009

Прежде всего, входной файл не совпадает с другими входными данными, вы должны помнить об этом ... это по соображениям безопасности. Когда входной файл получает фокус, он должен быть доступен только для чтения, или браузер должен открыть диалоговое окно для выбора какого-либо файла.

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

<script type="text/javascript">

function yourFunction()
{
   ...;
};

alert('hello world!");

yourFunction();

</script>

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

Если вы можете, вы должны использовать jQuery для написания javascript. Это сделает вашу жизнь оооочень легкой ....:)

0 голосов
/ 01 мая 2009

Попробуйте поиграть с атрибутом tabstop

...