suchen

Heim >Web-Frontend >js-Tutorial >Kann ich die JavaScript-Funktion „focus()' für ein „Element' verwenden?

Kann ich die JavaScript-Funktion „focus()' für ein „Element' verwenden?

DDD
DDDOriginal
2024-11-05 04:50:02543Durchsuche

Can I Use JavaScript's `focus()` Function on a `` Element?

Fokussierung auf eine
Element mit JavaScript

Frage:

Ist es möglich, sich auf ein

zu konzentrieren? Element mit der JavaScript-Funktion focus()?

Hintergrund:

A

Element wird verwendet:

<code class="html"><div id="tries">You have 3 tries left</div></code>

Und es wird versucht, sich auf dieses

zu konzentrieren. mit dem Code:

<code class="javascript">document.getElementById('tries').focus();</code>

Der Fokus wird jedoch nicht angewendet.

Antwort:

Ja, es ist möglich, darauf zu fokussieren ein

Element mit der Funktion focus(). Der wichtigste Schritt besteht darin, dem
ein Tabindex-Attribut zuzuweisen:

<code class="html"><div tabindex="0">You have 3 tries left</div></code>

Ein Tabindex von 0 platziert das Tag innerhalb der natürlichen Tab-Reihenfolge der Seite. Höhere Zahlen weisen eine bestimmte Prioritätsreihenfolge zu, wobei 1 die erste, 2 die zweite usw. ist.

Darüber hinaus bewirkt ein Tabindex von -1, dass

Fokussierbar nur durch Skripte, nicht durch Benutzeraktionen.

Hier ist ein Codebeispiel, das dies veranschaulicht:

<code class="javascript">document.getElementById('tries').onclick = function () {
    document.getElementById('scripted').focus();
};</code>
<code class="css">div:focus {
    background-color: Aqua;
}</code>
<code class="html"><div>Element X (not focusable)</div>
<div tabindex="0">Element Y (user or script focusable)</div>
<div tabindex="-1" id="scripted">Element Z (script-only focusable)</div>
<div id="test">Set Focus To Element Z</div></code>

Das obige ist der detaillierte Inhalt vonKann ich die JavaScript-Funktion „focus()' für ein „Element' verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript using Attribute function this background
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Wie kann ich in JavaScript asynchron über große Arrays iterieren, um die Reaktionsfähigkeit der Benutzeroberfläche zu erhalten?Nächster Artikel：Wie kann ich in JavaScript asynchron über große Arrays iterieren, um die Reaktionsfähigkeit der Benutzeroberfläche zu erhalten?

In Verbindung stehende Artikel

Mehr sehen