Использование jquery как сфокусировать первый элемент (поле редактирования, область текста, раскрывающееся поле и т.д.) в форме при загрузке страницы?
Что-то вроде:
document.forms[0].elements[0].focus();
но используя jquery.
Другое требование, не фокусируйте первый элемент, когда форма имеет class= "фильтр".
Для фона я использовал script в ruby on rails app. Попробовав весь свой ответ и узнав, что все не работают, При поиске в google я нашел этот фрагмент, который работает:
$(function() {
$("form:not(.filter) :input:visible:enabled:first").focus();
});
Похоже, что $('form :input:first') соответствует скрытому вводу, который рельсы вставляют в каждую форму.
$('form:not(.filter) :input:visible:enabled:first').focus()
Здесь будет выбран первый видимый элемент ввода (<input />, <select>, <textarea>), который не имеет в нем класса filter.
Мне нравится отмечать мой выбранный элемент классом и выбирать по классу, а не оставлять его до порядка элементов на странице. Я нахожу это намного проще, чем пытаться запомнить, чтобы обновить алгоритм "что такое первый первый элемент" при выборе элементов, которые могут быть скрыты или не могут быть скрыты, могут или не могут быть введены каркасом,...
$(document).ready( function() {
$('input.js-initial-focus:first').focus(); // choose first just in case
});
Это не однострочное решение, но оно учитывает поле ввода реального первого пользователя (может ли оно быть < input/ > или <select> tag).
Вам просто нужно немного подкорректировать это, и вы получите то, что вам нужно.
P.S: Я тестировал этот код в FireFox, Chrome и IE6.
function focusFirstFormField() {
try {
var selector = $("#formid");
if (selector.length >= 1 && selector[0] && selector[0].elements && selector[0].elements.length > 0) {
var elements = selector[0].elements;
var length = elements.length;
for (var i = 0; i < length; i++) {
var elem = elements[i];
var type = elem.type;
// ignore images, hidden fields, buttons, and submit-buttons
if (elem.style.display != "none" /* check for visible */ && type != "image" && type != "hidden" && type != "button" && type != "submit") {
elem.focus();
break;
}
}
}
}
catch(err) { /* ignore error if any */ }
}
$("form").find('input[type=text],textarea,select').filter(':visible:first').focus();
У меня возникли проблемы с диалоги jQuery, которые были невидимы на странице, но все же были выбраны селектором:
$(":text:visible:enabled:first").focus();
После многих игр я наконец придумал решение, которое исключило все входы в divs с классом .dialog, добавив ".not() в конец. Это может быть полезно кому-то другому. Это мой селектор:
$(":text:visible:enabled:first").not("div .dialog input").focus();