ชาวเน็ตถามคำถามดังที่แสดงใน HTML ต่อไปนี้ทำไมแต่ละเอาต์พุตถึง 5 แทนที่จะคลิกที่แต่ละ P คุณจะแจ้งเตือน 1, 2, 3, 4, 5
<html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> การปิดการสาธิต </title> <script type = "text/javascript"> function init () สำหรับ (var i = 0; i <pary.length; i ++) {pary [i] .onclick = function () {Alert (i); }}} </script> </head> <body onload = "init ();"> <p> ผลิตภัณฑ์ 1 </p> <p> ผลิตภัณฑ์ 2 </p> <p> ผลิตภัณฑ์ 3 </p> <p> ผลิตภัณฑ์ 4 </p> <p> ผลิตภัณฑ์ 5 </p> </body> </html>มีวิธีแก้ปัญหาหลายประการ
1. บันทึกตัวแปร I ไปยังแต่ละวัตถุวรรค (p)
ฟังก์ชั่น init () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {pary [i] .i = i; pary [i] .onclick = function () {Alert (this.i); -2. บันทึกตัวแปร I ในฟังก์ชันที่ไม่ระบุชื่อเอง
ฟังก์ชั่น init2 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {(pary [i] .onclick = function () {alert (arguments.callee.i);}). i = i; -3. เพิ่มเลเยอร์ของการปิดและฉันถูกส่งผ่านไปยังฟังก์ชันด้านในในรูปแบบของพารามิเตอร์ฟังก์ชัน
ฟังก์ชั่น init3 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {(ฟังก์ชั่น (arg) {pary [i] .onclick = function () {alert (arg);};}) (i); // อาร์กิวเมนต์เมื่อโทร}}}}}}}}}}}}}4. เพิ่มเลเยอร์ของการปิดและฉันถูกส่งผ่านไปยังฟังก์ชันหน่วยความจำในรูปแบบของตัวแปรท้องถิ่น
ฟังก์ชั่น init4 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {(ฟังก์ชัน () {var temp = i; // ตัวแปรท้องถิ่น pary [i] .onclick = function () {Alert (temp);}}) (); -5. เพิ่มเลเยอร์ของการปิดและส่งคืนฟังก์ชั่นเป็นเหตุการณ์ตอบสนอง (หมายเหตุความแตกต่างเล็กน้อยจาก 3)
ฟังก์ชั่น init5 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {pary [i] .onclick = function (arg) {return function () {// return a function alert (arg); } }(ฉัน); -6. นำไปใช้กับฟังก์ชั่นในความเป็นจริงทุกครั้งที่มีการสร้างอินสแตนซ์ฟังก์ชั่นการปิดจะถูกสร้างขึ้น
ฟังก์ชั่น init6 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {pary [i] .onclick = ฟังก์ชั่นใหม่ ("การแจ้งเตือน (" + i + ");"); // ใหม่สร้างอินสแตนซ์ฟังก์ชั่นทีละครั้ง}}}7. ใช้ฟังก์ชั่นเพื่อนำไปใช้ให้ความสนใจกับความแตกต่างระหว่าง 6
ฟังก์ชั่น init7 () {var pary = document.getElementsByTagname ("P"); สำหรับ (var i = 0; i <pary.length; i ++) {pary [i] .onclick = function ('การแจ้งเตือน ('+i+')')}}}ข้างต้นคือการสนทนาสั้น ๆ เกี่ยวกับ JavaScript สำหรับการปิดลูปที่บรรณาธิการนำมาให้คุณ ฉันหวังว่าทุกคนจะสนับสนุน wulin.com เพิ่มเติม ~