hujung hadapan web
tutorial js
Penjelasan terperinci tentang THIS dan WINDOW.EVENT.SRCELEMENT dalam kemahiran JS_javascript
Penjelasan terperinci tentang THIS dan WINDOW.EVENT.SRCELEMENT dalam kemahiran JS_javascript
Mari kita lihat contoh mudah dahulu:
Tiada masalah sama sekali.
Jadi dalam keadaan apa ia tidak boleh digunakan?
fuction method()
{
alert(this.value);
}
<input type="text" onblur="method()"/>Ini tidak mungkin kerana method() ialah fungsi yang dipanggil oleh fungsi tindak balas.
Jadi apa yang perlu anda lakukan dalam situasi ini?
Kaedah 1:
fuction method(btn)
{
alert(btn.value);
}
<input type="text" onblur="method(this)"/>Tiada masalah!
Kaedah 2:
fuction method()
{
alert(window.event.srcElement.value);
}
<input type="text" onblur="method()"/>Tiada masalah! window.event.srcElement mendapat kawalan yang mencetuskan acara
Kami sedang melihat contoh yang lebih berbelit-belit
<head>
<script type="text/javascript">
function InitEvent() {
var inputs = document.getElementsByTagName_r("input");
for (var i = 0; i < inputs.length; i++) {
inputs[i].onblur = OnblurEvent;
}
}
function OnblurEvent() {
// OnblurEvent是onblur的响应函数，而不是被响应函数调用的函数
// 所以可以用this来获取发生事件的对象
if (this.value.length > 0) {
this.style.backgroundColor = "white";
}
else {
this.style.backgroundColor = "red";
}
}
</script>
</head>
<body onload="InitEvent()">
<input id="Text1" type="text" />
<input id="Text2" type="text" />
<input id="Text3" type="text" />
</body>
</html>Mari kita lihat perbezaan dan kaitan antara keduanya
ini:
Mari lihat contoh:
<html>
<title>this与srcElement的区别</title>
<head>
<script type="text/javascipt>"
function btnClick(){
alert(this.value);
}
</script>
</head>
<body>
<input type="button" value="单击" onclick="btnClick()"/>
</body>
</html>
Jawapan yang muncul pada masa ini ialah "tidak ditentukan", yang bermaksud atribut ini tidak boleh digunakan untuk mendapatkannya apabila memanggil fungsi. Mari lihat contoh seterusnya:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script type="text/javascript">
function btnClick(btn){
alert(btn.value);
}
</script>
</head>
<body>
<input type="button" onclick="btnClick(this)" value="单击" />
</body>
</html>
Jawapan yang diperolehi pada masa ini ialah "klik", mengapa boleh pada masa ini? Seperti yang dapat dilihat daripada kod, apabila acara onclick memanggil fungsi btnClick(), ini dihantar kepada fungsi sebagai parameter.
Untuk meringkaskan perkara di atas: Apabila memanggil fungsi, anda tidak boleh menggunakan atribut ini secara langsung untuk mendapatkannya, tetapi ini mesti dihantar sebagai parameter.
window.event.srcElement:
Lihat contoh di bawah:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script type="text/javascript">
function btnClick(){
alert(window.event.srcElement.value);
}
</script>
</head>
<body>
<input type="button" onclick="btnClick()" value="单击" />
</body>
</html>
Jawapan yang diperoleh pada masa ini ialah "klik", menunjukkan bahawa anda boleh menggunakan sifat window.event.srcElement untuk mendapatkannya apabila memanggil fungsi.
Mengapa ini tidak boleh digunakan secara langsung tetapi window.event.srcElement boleh digunakan secara terus? Dalam erti kata literal ini bermaksud "semasa". Apabila fungsi dipanggil, kawalan khusus tidak dinyatakan. Ia tidak dibenarkan untuk menggunakannya secara langsung dalam fungsi. Dalam sekeping kod kedua, ini diluluskan sebagai parameter, jadi jawapan yang betul boleh diperolehi.
MalahPerbezaan antara penggunaan ini dan window.event.srcElement ialah: jika anda ingin menggunakan atribut ini secara langsung, fungsi pada masa ini tidak boleh dipanggil tetapi mestilah fungsi tindak balas , manakala window.event srcElement tidak mempunyai sekatan sedemikian.
Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
1389
52
Mari kita bincangkan mengapa Vue2 boleh mengakses atribut dalam pelbagai pilihan melalui ini
Dec 08, 2022 pm 08:22 PM
Artikel ini akan membantu anda mentafsir kod sumber vue dan memperkenalkan sebab anda boleh menggunakan ini untuk mengakses sifat dalam pelbagai pilihan dalam Vue2. Saya harap ia akan membantu semua orang.
Artikel untuk memahami panduan ini dan mengejar 70% orang hadapan
Sep 06, 2022 pm 05:03 PM
Seorang rakan sekerja tersekat kerana pepijat yang ditunjukkan oleh masalah penunjuk Vue2 ini menyebabkan fungsi anak panah digunakan, mengakibatkan ketidakupayaan untuk mendapatkan prop yang sepadan. Dia tidak tahu apabila saya memperkenalkannya kepadanya, dan kemudian saya sengaja melihat kumpulan pertukaran bahagian hadapan Setakat ini, sekurang-kurangnya 70% pengaturcara bahagian hadapan masih tidak memahaminya anda pautan ini. Jika semuanya tidak jelas saya belum belajar bagaimana untuk melakukannya, sila berikan saya mulut yang besar.
Cara bijak untuk menggunakan kata kunci ini dalam jQuery
Feb 25, 2024 pm 04:09 PM
Penggunaan fleksibel kata kunci ini dalam jQuery Dalam jQuery, kata kunci ini adalah konsep yang sangat penting dan fleksibel Ia digunakan untuk merujuk kepada elemen DOM yang sedang dimanipulasi. Dengan menggunakan kata kunci ini secara rasional, kami boleh mengendalikan elemen pada halaman dengan mudah dan mencapai pelbagai kesan dan fungsi interaktif. Artikel ini akan menggabungkan contoh kod khusus untuk memperkenalkan penggunaan fleksibel kata kunci ini dalam jQuery. Mudah contoh ini Mula-mula, mari kita lihat contoh mudah ini. Katakan kita mempunyai a
Apa ini? Analisis mendalam tentang ini dalam JavaScript
Aug 04, 2022 pm 05:02 PM
Apa ini? Artikel berikut akan memperkenalkan anda kepada ini dalam JavaScript, dan bercakap tentang perbezaan antara ini dalam kaedah panggilan yang berbeza fungsi saya harap ia akan membantu anda!
Bagaimana untuk menggunakan kaedah ini dalam Java
Apr 18, 2023 pm 01:58 PM
1. kata kunci ini 1. Jenis ini: Objek yang dipanggil ialah jenis rujukan objek itu 2. Ringkasan penggunaan 1. this.data;//Atribut akses 2. this.func();//Kaedah akses 3.this ( );//Panggil pembina lain dalam kelas ini 3. Penjelasan penggunaan 1.this.data digunakan dalam kaedah ahli Mari kita lihat apa yang akan berlaku jika ini tidak ditambah classMyDate{publicintyear;publicintmonth;publicintday(intyear,. intmonth,intday){ye
Bagaimanakah JavaScript mengubah penunjuk ini? Analisis ringkas tiga kaedah
Sep 19, 2022 am 09:57 AM
Bagaimanakah JavaScript mengubah penunjuk ini? Artikel berikut akan memperkenalkan kepada anda tiga kaedah untuk menukar penunjuk ini dalam JS. Saya harap ia akan membantu anda!
Penjelasan terperinci tentang ini dalam fungsi anak panah JavaScript
Jan 25, 2024 pm 01:41 PM
Fungsi anak panah dalam JavaScript adalah sintaks yang agak baru Ia tidak mempunyai kata kunci ini sendiri Sebaliknya, fungsi anak panah ini menghala ke objek skop yang mengandunginya statik; 2. Fungsi Anak panah tidak boleh digunakan sebagai pembina 3. Fungsi anak panah tidak boleh digunakan sebagai kaedah.
Biar saya terangkan secara terperinci empat peraturan yang mengikat ini
Nov 01, 2022 pm 05:49 PM
Kata kunci ini adalah salah satu mekanisme yang paling kompleks dalam JavaScript. Ia adalah kata kunci yang sangat istimewa yang ditakrifkan secara automatik dalam skop semua fungsi. Tetapi pembangun JavaScript yang sangat berpengalaman pun mengalami kesukaran untuk mengetahui apa sebenarnya yang dituju.
