Rumah > Artikel > hujung hadapan web > Bagaimana javascript mengendalikan fokus
Bagaimana javascript mengendalikan fokus
- 藏色散人asal
- 2021-10-18 14:11:542304semak imbas
Cara mengendalikan fokus dalam JavaScript: 1. Dapatkan fokus melalui kaedah "field.focus();" 2. Tangani kehilangan melalui "o[i].blur = function(){.. .}" fokus kaedah.
Persekitaran pengendalian artikel ini: sistem windows7, versi javascript 1.8.5, komputer DELL G3
Bagaimana cara javascript mengendalikan fokus?
Pemprosesan fokus JavaScript (dapatkan fokus, hilang fokus kabur)
Pemprosesan fokus
Pemprosesan fokus terutamanya termasuk fokus (dapatkan fokus) dan jenis acara kabur (hilang fokus). Fokus yang dipanggil adalah untuk mengaktifkan medan borang supaya ia boleh bertindak balas kepada acara papan kekunci.
Dapatkan fokus: fokus
Acara ini dicetuskan apabila anda mengklik atau menggunakan kekunci Tab untuk bertukar kepada elemen borang atau objek hiperpautan. Acara fokus ialah cara untuk menentukan kedudukan semasa tetikus dalam halaman. Secara lalai, keseluruhan dokumen berada dalam fokus, tetapi anda boleh menukar kedudukan fokus dengan mengklik atau menggunakan kekunci Tab. '
Contoh: Selepas halaman dimuatkan, pindahkan fokus ke medan kotak teks pertama dalam borang, menyediakannya untuk menerima input pengguna
<form id="myform" method="post" action="#">
姓名<input type="text" name="name"/><br>
密码<input type="password" name="pass" /></form>
<script>
var form = document.getElementById("myform");
var field = form.elements("name");
window.onload = function(){
field.focus();
}
</scriipt>Kehilangan fokus: kabur
Jenis acara kabur menunjukkan tindak balas apabila elemen kehilangan fokus Ia sepadan dengan jenis acara fokus dan terutamanya mempengaruhi elemen borang dan objek hiperpautan elemen terikat pada fokus dan pengendali acara kabur, yang menetapkan elemen untuk kelihatan cembung apabila ia mendapat fokus dan kelihatan cekung apabila ia kehilangan fokus
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title></title> </head> <body>
<input type="text" />
<input type="text" />
<script>
var o = document.getElementsByTagName("input");
for(var i = 0; i < o.length; i++){
o[i].onfocus = function(){
this.style.borderStyle = "outset";
}
o[i].blur = function(){
this.style.borderStyle = "inset";
} }
</script>
</body></html>
Nota: Sembunyikan medan jika (), atau gunakan paparan CSS dan keterlihatan untuk menyembunyikan paparan medan Menetapkannya untuk mendapatkan fokus akan menyebabkan pengecualian.
Kajian yang disyorkan: "
Tutorial Asas JavaScriptAtas ialah kandungan terperinci Bagaimana javascript mengendalikan fokus. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!