Antworten:
Wenn Sie jquery verwenden:
$(function() {
$("#Box1").focus();
});oder Prototyp:
Event.observe(window, 'load', function() {
$("Box1").focus();
});oder einfaches Javascript:
window.onload = function() {
document.getElementById("Box1").focus();
};Beachten Sie jedoch, dass dies andere On-Load-Handler ersetzt. Suchen Sie daher in Google nach addLoadEvent (), um Onload-Handler sicher anzuhängen, anstatt sie zu ersetzen.
In HTML gibt es ein autofocusAttribut für alle Formularfelder. In Dive Into HTML 5 gibt es ein gutes Tutorial dazu . Leider wird es derzeit von IE-Versionen unter 10 nicht unterstützt .
So verwenden Sie das HTML 5-Attribut und greifen auf eine JS-Option zurück:
<input id="my-input" autofocus="autofocus" />
<script>
if (!("autofocus" in document.createElement("input"))) {
document.getElementById("my-input").focus();
}
</script>Es sind keine jQuery-, Onload- oder Event-Handler erforderlich, da sich das JS unter dem HTML-Element befindet.
Bearbeiten: Ein weiterer Vorteil ist, dass JavaScript in einigen Browsern deaktiviert ist und Sie das JavaScript entfernen können, wenn Sie ältere Browser nicht unterstützen möchten.
Bearbeiten 2: Firefox 4 unterstützt jetzt das autofocusAttribut und lässt den IE ohne Unterstützung.
autofocus="aufofocus"? Alle von Ihnen angegebenen Links sagen nur, dass Sie das Attribut hinzufügen sollen : autofocus.
attribute="value"boolesche Attribute zu verwenden. HTML5 kam mit der "leeren Attributsyntax" und wir haben die Redundanz entfernt. Jetzt können wir tun<input checked disabled autofocus data-something>
Sie müssen Javascript verwenden:
<BODY onLoad="document.getElementById('myButton').focus();">@Ben merkt an, dass Sie solche Ereignishandler nicht hinzufügen sollten. Während dies eine andere Frage ist, empfiehlt er, dass Sie diese Funktion verwenden:
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}Rufen Sie dann addLoadEvent auf Ihrer Seite auf und verweisen Sie auf eine Funktion, die den Fokus auf das gewünschte Textfeld legt.
Schreiben Sie einfach den Autofokus in das Textfeld. Das ist einfach und funktioniert so:
<input name="abc" autofocus></input>Hoffe das hilft.
Sie können dies einfach tun, indem Sie jquery folgendermaßen verwenden:
<script type="text/javascript">
$(document).ready(function () {
$("#myTextBoxId").focus();
});
</script>durch Aufrufen dieser Funktion in $(document).ready().
Dies bedeutet, dass diese Funktion ausgeführt wird, wenn das DOM bereit ist.
Weitere Informationen zur READY-Funktion finden Sie unter: http://api.jquery.com/ready/
Mit einfachem Vanille-HTML und 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>Für diejenigen, die das .net-Framework und asp.net 2.0 oder höher verwenden, ist es trivial. Wenn Sie ältere Versionen des Frameworks verwenden, müssen Sie ein ähnliches Javascript wie oben schreiben.
In Ihrem OnLoad-Handler (im Allgemeinen page_load, wenn Sie die mit Visual Studio gelieferte Stock-Seitenvorlage verwenden) können Sie Folgendes verwenden:
C #
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(* Hinweis: Ich habe das Unterstrichzeichen aus dem Funktionsnamen entfernt, der im Allgemeinen Page Load ist, da es in einem Codeblock nicht ordnungsgemäß gerendert werden konnte. In der Markup-Dokumentation konnte ich nicht sehen, wie Unterstriche zum unübersichtlichen Rendern gebracht werden.)
Hoffe das hilft.
IMHO, die 'sauberste' Möglichkeit, das erste sichtbare, aktivierte Textfeld auf der Seite auszuwählen, besteht darin, jQuery zu verwenden und Folgendes zu tun:
$(document).ready(function() {
$('input:text[value=""]:visible:enabled:first').focus();
});Hoffentlich hilft das...
Vielen Dank...
<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> Als allgemeinen Rat würde ich empfehlen, den Fokus nicht aus der Adressleiste zu stehlen. ( Jeff hat bereits darüber gesprochen. )
Das Laden der Webseite kann einige Zeit dauern. Dies bedeutet, dass Ihre Fokusänderung einige Zeit nach der Eingabe der pae-URL durch den Benutzer erfolgen kann. Dann hätte er seine Meinung ändern und wieder URLs eingeben können, während Sie Ihre Seite laden und den Fokus stehlen, um sie in Ihr Textfeld einzufügen.
Dies ist der einzige Grund, warum ich Google als Startseite entfernt habe.
Wenn Sie das Netzwerk (lokales Netzwerk) steuern oder wenn der Fokuswechsel darin besteht, ein wichtiges Usability-Problem zu lösen, vergessen Sie natürlich alles, was ich gerade gesagt habe :)
Ich hatte ein etwas anderes Problem. Ich wollte autofocus, wollte aber, dass der placeholderText browserübergreifend bleibt. Einige Browser würden den placeholderText ausblenden, sobald das Feld fokussiert ist, andere würden ihn behalten. Ich musste entweder Platzhalter dazu bringen, browserübergreifend zu bleiben, was seltsame Nebenwirkungen hat, oder die Verwendung einstellen autofocus.
Also habe ich auf den ersten Schlüssel gewartet, der gegen das Body-Tag eingegeben wurde, und diesen Schlüssel in das Ziel-Eingabefeld umgeleitet. Dann werden alle beteiligten Event-Handler getötet, um die Dinge sauber zu halten.
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);Es ist möglich, autofocusEingabeelemente einzustellen
<input type="text" class="b_calle" id="b_calle" placeholder="Buscar por nombre de calle" autofocus="autofocus">Wenn Sie ASP.NET verwenden, können Sie verwenden
yourControlName.Focus()im Code auf dem Server, der der Seite das entsprechende JavaScript hinzufügt.
Andere serverseitige Frameworks verfügen möglicherweise über eine entsprechende Methode.