HTML ondrop Event Attribute
ตัวอย่าง
เรียกใช้ JavaScript เมื่อองค์ประกอบที่ลากได้ลดลงในองค์ประกอบ <div>:
<div ondrop="myFunction(event)"></div>
ความหมายและการใช้งาน
แอ็ตทริบิวต์ ondrop เริ่มทำงานเมื่อองค์ประกอบที่ลากได้หรือการเลือกข้อความถูกดร็อปบนเป้าหมายการดร็อปที่ถูกต้อง
การลากและวางเป็นคุณลักษณะทั่วไปใน HTML5 คือเมื่อคุณ "คว้า" วัตถุแล้วลากไปยังตำแหน่งอื่น สำหรับข้อมูลเพิ่มเติม โปรดดูบทช่วยสอน HTML ของเราเกี่ยวกับHTML5 Drag and Drop
หมายเหตุ:ในการทำให้องค์ประกอบสามารถลากได้ ให้ใช้ แอตทริบิวต์ ที่ ลาก ได้ของ HTML5 ทั่วโลก
เคล็ดลับ:ลิงก์และรูปภาพสามารถลากได้ตามค่าเริ่มต้น และไม่ต้องการแอตทริบิวต์ที่ลากได้
มีแอตทริบิวต์เหตุการณ์มากมายที่ใช้ และสามารถเกิดขึ้นได้ในขั้นตอนต่างๆ ของการดำเนินการลากแล้วปล่อย:
- เหตุการณ์ที่เกิดขึ้นกับเป้าหมายที่ลากได้ (องค์ประกอบต้นทาง) :
- ondragstart - เริ่มทำงานเมื่อผู้ใช้เริ่มลากองค์ประกอบ
- ondrag - ยิงเมื่อองค์ประกอบถูกลาก
- ondragend - เริ่มทำงานเมื่อผู้ใช้ลากองค์ประกอบเสร็จแล้ว
- เหตุการณ์ที่เกิดขึ้นกับเป้าหมายการดรอป:
- ondragenter - ยิงเมื่อองค์ประกอบที่ลากเข้าสู่เป้าหมายการวาง
- ondragover - ยิงเมื่อองค์ประกอบที่ลากอยู่เหนือเป้าหมายการวาง
- ondragleave - ยิงเมื่อองค์ประกอบที่ถูกลากออกจากเป้าหมายการดร็อป
- ondrop - ยิงเมื่อองค์ประกอบที่ลากถูกดร็อปบนเป้าหมายการดรอป
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนแอตทริบิวต์เหตุการณ์อย่างสมบูรณ์
Event Attribute | |||||
---|---|---|---|---|---|
ondrop | 4.0 | 9.0 | 3.5 | 6.0 | 12.0 |
ไวยากรณ์
<element ondrop="script">
ค่าแอตทริบิวต์
Value | Description |
---|---|
script | The script to be run on ondrop |
รายละเอียดทางเทคนิค
แท็ก HTML ที่รองรับ: | องค์ประกอบ HTML ทั้งหมด |
---|
หน้าที่เกี่ยวข้อง
บทช่วยสอน HTML: HTML5 การลากและวาง
การอ้างอิง HTML: แอตทริบิวต์ HTML ที่ลากได้
การอ้างอิง HTML DOM: ondrop Event
❮ คุณสมบัติเหตุการณ์ HTML