Netizen mengajukan pertanyaan, seperti yang ditunjukkan dalam HTML berikut, mengapa setiap output menjadi 5, alih -alih mengklik setiap P, Anda akan mengingatkan 1, 2, 3, 4, 5 yang sesuai.
<html> <head> <meta http-equiv = "konten-tipe" content = "text/html; charset = utf-8"/> <itement> demo penutupan </iteme> <script type = "text/javascript"> function init () {var pary = document.geteLementsbybyname ("p" p "); untuk (var i = 0; i <pary.length; i ++) {pary [i] .Onclick = function () {waspada (i); }}} </script> </head> <body onload = "init ();"> <p> Produk 1 </p> <p> Produk 2 </p> <p> Produk 3 </p> <p> Produk 4 </p> <p> Produk 5 </p> </btml> </html>Ada beberapa solusi
1. Simpan variabel I untuk setiap objek paragraf (p)
function init () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {pary [i] .i = i; pary [i] .Onclick = function () {alert (this.i); }}}2. Simpan variabel i dalam fungsi anonim itu sendiri
function init2 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {(pary [i] .Onclick = function () {alert (arguments.callee.i);}). i = i; }}3. Tambahkan lapisan penutupan, dan saya diteruskan ke fungsi dalam dalam bentuk parameter fungsi.
function init3 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {(function (arg) {pary [i] .onClick = function () {waspada (arg);};}) (i); // argumen saat memanggil}}}4. Tambahkan lapisan penutupan, dan saya diteruskan ke fungsi memori dalam bentuk variabel lokal
function init4 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {(function () {var temp = i; // variabel lokal pary [i] .Onclick = function () {waspada (temp);}}) (); }}5. Tambahkan lapisan penutupan dan kembalikan fungsi sebagai peristiwa respons (perhatikan perbedaan halus dari 3)
function init5 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {pary [i] .Onclick = function (arg) {return function () {// return function alert (arg); } }(Saya); }}6. Diimplementasikan dengan fungsi, pada kenyataannya, setiap kali contoh fungsi dihasilkan, penutupan akan dihasilkan.
function init6 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {pary [i] .onClick = fungsi baru ("peringatan (" + i + ");"); // Baru menghasilkan satu instance fungsi pada satu waktu}}7. Gunakan fungsi untuk mengimplementasikannya, perhatikan perbedaan antara 6
function init7 () {var pary = document.geteLementsbyTagname ("p"); untuk (var i = 0; i <pary.length; i ++) {pary [i] .Onclick = function ('alert ('+i+')')}}Di atas adalah diskusi singkat tentang JavaScript untuk penutupan loop yang dibawa editor kepada Anda. Saya harap semua orang akan mendukung wulin.com lebih banyak ~