Odpowiedzi:
Jeśli używasz jquery:
$(function() {
$("#Box1").focus();
});
lub prototyp:
Event.observe(window, 'load', function() {
$("Box1").focus();
});
lub zwykły javascript:
window.onload = function() {
document.getElementById("Box1").focus();
};
pamiętaj jednak, że spowoduje to zastąpienie innych modułów obsługi ładunku, więc poszukaj metody addLoadEvent () w Google, aby w bezpieczny sposób zamiast zastępować dołączać moduły obsługi ładowania.
W HTML istnieje autofocus
atrybut dla wszystkich pól formularza. W Dive Into HTML 5 znajduje się dobry samouczek . Niestety obecnie nie jest obsługiwany przez wersje IE mniejsze niż 10.
Aby użyć atrybutu HTML 5 i wrócić do opcji JS:
<input id="my-input" autofocus="autofocus" />
<script>
if (!("autofocus" in document.createElement("input"))) {
document.getElementById("my-input").focus();
}
</script>
Nie są wymagane żadne moduły obsługi jQuery, onload ani zdarzeń, ponieważ JS znajduje się poniżej elementu HTML.
Edycja: kolejną zaletą jest to, że w niektórych przeglądarkach działa on z wyłączoną obsługą JavaScript i możesz usunąć JavaScript, jeśli nie chcesz obsługiwać starszych przeglądarek.
Edycja 2: Firefox 4 obsługuje teraz autofocus
atrybut, pozostawiając IE bez obsługi.
autofocus="aufofocus"
? Wszystkie linki podałeś po prostu powiedzieć, aby dodać atrybut: autofocus
.
attribute="value"
przypadku atrybutów boolowskich. HTML5 pojawił się wraz z „pustą składnią atrybutu” i porzuciliśmy nadmiarowość. Teraz możemy zrobić<input checked disabled autofocus data-something>
Musisz użyć javascript:
<BODY onLoad="document.getElementById('myButton').focus();">
@Ben zauważa, że nie należy dodawać takich programów obsługi zdarzeń. Chociaż to kolejne pytanie, zaleca skorzystanie z tej funkcji:
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
Następnie umieść wywołanie addLoadEvent na swojej stronie i odwołaj się do funkcji, która ustawi fokus na żądane pole tekstowe.
Po prostu wpisz autofokus w polu tekstowym. To jest proste i działa tak:
<input name="abc" autofocus></input>
Mam nadzieję że to pomoże.
Możesz to łatwo zrobić używając jquery w następujący sposób:
<script type="text/javascript">
$(document).ready(function () {
$("#myTextBoxId").focus();
});
</script>
wywołując tę funkcję w $(document).ready()
.
Oznacza to, że ta funkcja zostanie wykonana, gdy DOM będzie gotowy.
Więcej informacji na temat funkcji READY można znaleźć pod adresem : http://api.jquery.com/ready/
Używając zwykłego vanilla html i javascript
<input type='text' id='txtMyInputBox' />
<script language='javascript' type='text/javascript'>
function SetFocus()
{
// safety check, make sure its a post 1999 browser
if (!document.getElementById)
{
return;
}
var txtMyInputBoxElement = document.getElementById("txtMyInputBox");
if (txtMyInputBoxElement != null)
{
txtMyInputBoxElement.focus();
}
}
SetFocus();
</script>
Dla tych, którzy używają platformy .net i asp.net 2.0 lub nowszej, jest to trywialne. Jeśli używasz starszych wersji frameworka, musisz napisać trochę javascript, podobnie jak powyżej.
W programie obsługi OnLoad (zazwyczaj page_load, jeśli używasz szablonu strony stockowej dostarczonego z programem Visual Studio) możesz użyć:
DO#
protected void PageLoad(object sender, EventArgs e)
{
Page.SetFocus(txtMyInputBox);
}
VB.NET
Protected Sub PageLoad(sender as Object, e as EventArgs)
Page.SetFocus(txtMyInputBox)
End Sub
(* Uwaga: Usunąłem znak podkreślenia z nazwy funkcji, która jest generalnie Page_Load, ponieważ w bloku kodu odmówił prawidłowego renderowania! Nie widziałem w dokumentacji znaczników, jak uzyskać podkreślenia, aby renderować bez znaku zmiany znaczenia.)
Mam nadzieję że to pomoże.
IMHO, najczystszym sposobem na wybranie pierwszego, widocznego, włączonego pola tekstowego na stronie, jest użycie jQuery i zrobienie czegoś takiego:
$(document).ready(function() {
$('input:text[value=""]:visible:enabled:first').focus();
});
Mam nadzieję, że to pomoże ...
Dzięki...
<html>
<head>
<script language="javascript" type="text/javascript">
function SetFocus(InputID)
{
document.getElementById(InputID).focus();
}
</script>
</head>
<body onload="SetFocus('Box2')">
<input id="Box1" size="30" /><br/>
<input id="Box2" size="30" />
</body>
</html>
Ogólnie radziłbym nie kraść fokusu z paska adresu. ( Jeff już o tym mówił. )
Załadowanie strony internetowej może zająć trochę czasu, co oznacza, że zmiana fokusu może nastąpić po dłuższym czasie od wpisania adresu URL pae przez użytkownika. Wtedy mógł zmienić zdanie i wrócić do wpisywania adresów URL, podczas gdy ty będziesz ładować swoją stronę i kraść fokus, aby umieścić ją w polu tekstowym.
To jedyny powód, dla którego usunąłem Google z mojej strony początkowej.
Oczywiście, jeśli kontrolujesz sieć (sieć lokalna) lub jeśli celem zmiany jest rozwiązanie ważnego problemu z użytecznością, zapomnij o wszystkim, co właśnie powiedziałem :)
Miałem nieco inny problem. Chciałem autofocus
, ale chciałem, żeby placeholder
tekst pozostał w różnych przeglądarkach. Niektóre przeglądarki ukrywały placeholder
tekst, gdy tylko pole było skoncentrowane, inne zachowywały go. Musiałem albo uzyskać symbole zastępcze pozostające w różnych przeglądarkach, co ma dziwne efekty uboczne, albo przestać ich używać autofocus
.
Więc nasłuchiwałem pierwszego klucza wpisanego względem znacznika body i przekierowałem ten klucz do docelowego pola wejściowego. Następnie wszystkie zaangażowane programy obsługi zdarzeń zostają zabite, aby zachować porządek.
var urlInput = $('#Url');
function bodyFirstKey(ev) {
$('body').off('keydown', bodyFirstKey);
urlInput.off('focus', urlInputFirstFocus);
if (ev.target == document.body) {
urlInput.focus();
if (!ev.ctrlKey && !ev.metaKey && !ev.altKey) {
urlInput.val(ev.key);
return false;
}
}
};
function urlInputFirstFocus() {
$('body').off('keydown', bodyFirstKey);
urlInput.off('focus', urlInputFirstFocus);
};
$('body').keydown(bodyFirstKey);
urlInput.focus(urlInputFirstFocus);
Możliwe jest ustawienie autofocus
na elementach wejściowych
<input type="text" class="b_calle" id="b_calle" placeholder="Buscar por nombre de calle" autofocus="autofocus">
Jeśli korzystasz z ASP.NET, możesz użyć
yourControlName.Focus()
w kodzie na serwerze, który doda odpowiedni JavaScript do strony.
Inne struktury po stronie serwera mogą mieć równoważną metodę.