วันนี้ฉันพบความต้องการที่แปลกมากซึ่งเป็นเช่นนี้: เมื่อฉันคลิกที่ข้อความปุ่มลบจะปรากฏขึ้นเพื่อลบข้อความที่ฉันเพิ่งคลิก
เฮ้? ฉันคิดถึงมันในเวลานั้นมันไม่ยาก แต่เนื่องจากมันเป็นความต้องการที่แปลกมันจะง่ายขนาดนี้ได้อย่างไร?
ใช่มีฟังก์ชั่นอื่น ฉันไม่รู้ว่าฉันคลิกแท็กไหน มีแท็กมากเกินไปที่สามารถพกข้อความเป็นภาษาอังกฤษได้ ...
ในเวลานั้นฉันสับสน คุณไม่ทราบว่าจะคลิกแท็กใดฉันจะผูกกิจกรรมได้อย่างไร สำหรับใครที่ฉันผูกกิจกรรม? ฉันยังต้องเขียนมันหลังจากพูดคุยกันมานาน ดังนั้นฉันจึงเริ่มทำงาน
ความคิดของฉันเป็นเช่นนี้:
เริ่ม
1. ก่อนอื่นคุณต้องได้รับวัตถุที่คลิกโดยเมาส์ (คำถามคือ ... ฉันจะรู้ได้อย่างไรว่าฉันคลิกแบบไหน)
จากนั้นเขียนฟังก์ชั่นเพื่อให้วัตถุคลิกโดยเมาส์
ฟังก์ชั่น get_tag ถูกผูกไว้กับเหตุการณ์ onclick ของร่างกายจากนั้นจึงยอมรับพารามิเตอร์เหตุการณ์
จากนั้นวัตถุเหตุการณ์มีแอตทริบิวต์เป้าหมายซึ่งเป็นวัตถุที่สามารถรับการคลิกเมาส์โดยตรง
เข้าสู่ระบบเพื่อดู
ก็โอเค มันสอดคล้องกับความคิดก่อนหน้านี้และได้รับผลลัพธ์ที่ต้องการ
2. รับวัตถุ แต่จะลบได้อย่างไร?
var del_tag = function () {var tag = null; return {get: function (e) {tag = e; }, del: function () {$ (tag) .remove (); -เนื่องจากปุ่มลบไม่มีส่วนเกี่ยวข้องกับวัตถุที่เราคลิกเราจึงต้องเขียนปิดและประกาศแท็กเพื่อบันทึกวัตถุที่เราคลิก
จากนั้นส่งคืนสองฟังก์ชั่นหนึ่งได้รับ ใช้เพื่อรับวัตถุที่เมาส์คลิกครั้งสุดท้าย หนึ่งคือ del. ตามชื่อหมายถึงลบวัตถุที่คลิก
เนื่องจากเป็นการปิดแท็กจะถูกบันทึกไว้ในหน่วยความจำเพียงเพื่อตระหนักถึงฟังก์ชั่นที่ต้องการ
3. การรวมกันของทั้งสอง
var del_tag = function () {var tag = null; return {get: function (e) {tag = e; }, del: function () {$ (tag) .remove (); }}} var dt = del_tag (); // กำหนด del_tag ให้กับฟังก์ชัน dt get_tag (e) {var ele = e.target; // การโทร dt.get () พารามิเตอร์คือค่าของพารามิเตอร์ฟังก์ชัน get_tag พารามิเตอร์เหตุการณ์ dt.get ($ (ele)); } $ ('#del') คลิก (function () {// ที่นี่เนื่องจากการปิดถูกสร้าง4. ตรวจสอบเอฟเฟกต์
5. เอฟเฟกต์ค่อนข้างดี แต่ ... คุณสามารถลบได้โดยคลิกที่วัตถุบางอย่าง นี่เป็นระเบียบ? จากนั้นเปลี่ยนมัน
var del_tag = function () {var tag = null; return {get: function (e) {tag = e; }, del: function () {$ (tag) .remove (); }}} var dt = del_tag (); // กำหนด del_tag ให้กับฟังก์ชัน dt get_tag (e) {var ele = e.target; $ (ele) .css ('ชายแดน', '1px Solid Red') var tagname = ele.tagname; // กำหนดอาร์เรย์แท็ก ใช้ในการจัดเก็บวัตถุที่เราต้องการลบ var tagarr = ['span', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p']; // ตัดสินว่าวัตถุที่เราคลิกนั้นประกาศในอาร์เรย์ของเราหรือไม่เราสามารถลบได้ if (tagarr.indexof (tagname)> -1) {// call dt.get () พารามิเตอร์คือค่าของพารามิเตอร์ฟังก์ชัน get_tag พารามิเตอร์เหตุการณ์เป้าหมาย dt.get ($ (ele)); }} $ ('#del') คลิก (ฟังก์ชัน () {// ที่นี่เนื่องจากการปิดถูกสร้างขึ้นวัตถุที่เราคลิกครั้งสุดท้ายถูกบันทึกไว้ // ดังนั้นคุณสามารถโทรหา dt.del () ที่นี่เพื่อลบวัตถุ dt.del ();})ตรวจสอบเอฟเฟกต์:
ใช่. ดูเหมือนว่าถูกต้อง ไม่สามารถลบได้หากไม่ใช่วัตถุที่เรากำหนด
แม้ว่ามันจะแตกต่างจากข้อความที่ถูกลบเล็กน้อยที่กล่าวถึงในข้อกำหนด แต่ตราบใดที่คุณบอกฉันว่าคุณจะใช้ป้ายกำกับเหล่านั้นเพื่อโฮสต์ข้อความฉันสามารถลบได้ ...
ให้ฉันเน้นว่าฟังก์ชั่น get_tag () ของเราไม่สามารถวางไว้ในร่างกายหรือเหตุการณ์ html onclick มิฉะนั้นข้อความของทั้งหน้าจะถูกลบทั้งหมด ...
ฟังก์ชั่น get_tag () ถูกผูกไว้กับ div ที่คุณต้องการลบข้อความ
บทความข้างต้น JS ได้รับวัตถุที่คลิกโดยเมาส์และคลิกปุ่มอื่นเพื่อลบรหัสการใช้งานของวัตถุคือเนื้อหาทั้งหมดที่ฉันได้แชร์กับคุณ ฉันหวังว่ามันจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น