Rumah > hujung hadapan web > tutorial js > Bolehkah saya Menggunakan Fungsi `focus()` JavaScript pada Elemen ``?

Bolehkah saya Menggunakan Fungsi `focus()` JavaScript pada Elemen ``?

DDD
Lepaskan: 2024-11-05 04:50:02
asal
542 orang telah melayarinya

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

Memfokuskan pada
Elemen Menggunakan JavaScript

Soalan:

Adakah ia boleh dilaksanakan untuk menumpukan pada

elemen dengan fungsi fokus() JavaScript?

Latar Belakang:

A

elemen sedang digunakan:

<code class="html"><div id="tries">You have 3 tries left</div></code>
Salin selepas log masuk

Dan percubaan dibuat untuk memfokuskan pada

dengan kod:

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

Walau bagaimanapun, tumpuan tidak digunakan.

Jawapan:

Ya, adalah mungkin untuk fokus pada a

elemen menggunakan fungsi fokus(). Langkah utama ialah menetapkan atribut tabindex kepada
:

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

Indeks tab 0 meletakkan teg dalam susunan tab semula jadi halaman. Nombor yang lebih tinggi menetapkan urutan keutamaan tertentu, dengan 1 sebagai yang pertama, 2 sebagai yang kedua, dan seterusnya.

Selain itu, indeks tab -1 menjadikan

hanya boleh difokuskan melalui skrip, bukan oleh tindakan pengguna.

Berikut ialah contoh kod yang menggambarkan ini:

<code class="javascript">document.getElementById('tries').onclick = function () {
    document.getElementById('scripted').focus();
};</code>
Salin selepas log masuk
<code class="css">div:focus {
    background-color: Aqua;
}</code>
Salin selepas log masuk
<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>
Salin selepas log masuk

Atas ialah kandungan terperinci Bolehkah saya Menggunakan Fungsi `focus()` JavaScript pada Elemen ``?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan