คำถามติดแท็ก dom-events

เหตุการณ์ DOM (Document Object Model) อนุญาตให้ภาษาการเขียนโปรแกรมขับเคลื่อนเหตุการณ์เพื่อลงทะเบียนตัวจัดการเหตุการณ์ / ผู้ฟังบนโหนดองค์ประกอบภายในแผนผัง DOM

7
JQuery mouseenter () vs mouseover ()
ดังนั้นหลังจากที่ได้อ่านเมื่อเร็ว ๆ นี้ตอบคำถามที่ผมไม่มีความชัดเจนว่าผมเข้าใจความแตกต่างระหว่างและmouseenter() mouseover()สถานะการโพสต์ MouseOver (): จะยิงเมื่อเข้าสู่องค์ประกอบและเมื่อใดก็ตามที่มีการเคลื่อนไหวของเมาส์เกิดขึ้นภายในองค์ประกอบนั้น MouseEnter (): จะยิงเมื่อเข้าสู่องค์ประกอบ ฉันเกิดซอที่ใช้ทั้งคู่และดูเหมือนว่าจะคล้ายกันมาก ใครช่วยอธิบายความแตกต่างระหว่างสองคนนี้ให้ฉันได้บ้าง ฉันได้ลองอ่านคำจำกัดความของ JQuery แล้วทั้งคู่ก็พูดในสิ่งเดียวกัน เหตุการณ์การวางเมาส์ถูกส่งไปยังองค์ประกอบเมื่อตัวชี้เมาส์เข้าสู่องค์ประกอบ เหตุการณ์ Mouseenter จะถูกส่งไปยังองค์ประกอบเมื่อตัวชี้เมาส์เข้าสู่องค์ประกอบ มีคนช่วยอธิบายด้วยตัวอย่างได้ไหม
172 jquery  dom-events 

19
ป้องกัน onmouseout เมื่อทำการโฮเวอร์องค์ประกอบลูกของ div div โดยไม่มี jQuery
ฉันกำลังมีปัญหากับonmouseoutฟังก์ชั่นใน divitoned แน่นอน เมื่อเมาส์กระทบกับองค์ประกอบลูกใน div เหตุการณ์ mouseout จะเกิดเพลิงไหม้ แต่ฉันไม่ต้องการให้มันยิงจนกว่าเมาส์จะออกจากตัวแม่ div ที่สมบูรณ์ ฉันจะป้องกันไม่ให้mouseoutเหตุการณ์เกิดขึ้นเมื่อมีการเข้าชมองค์ประกอบย่อยโดยไม่มี jQuery ได้อย่างไร ฉันรู้ว่าสิ่งนี้เกี่ยวข้องกับเหตุการณ์เดือดปุด ๆ แต่ฉันไม่มีโชคในการหาวิธีการทำงานออก ฉันพบโพสต์ที่คล้ายกันที่นี่: ฉันจะปิดการใช้งานเหตุการณ์ mouseout ที่ถูกทริกเกอร์โดยองค์ประกอบเด็กได้อย่างไร? อย่างไรก็ตามโซลูชันนั้นใช้ jQuery

14
วิธีแยกเมาส์“ คลิก” และ“ ลาก”
ผมใช้jQuery.clickในการจัดการกับเหตุการณ์การคลิกเมาส์บนกราฟราฟาเอลขณะที่ฉันต้องการที่จะจัดการกับเมาส์dragเหตุการณ์ลากเมาส์ประกอบด้วยmousedown, mouseupและmousemoveในราฟาเอล เป็นการยากที่จะแยกแยะclickและdragเนื่องจากclickยังมีmousedown& mouseup, ฉันจะแยกแยะความแตกต่างของเมาส์ "คลิก" และ "ลาก" เมาส์แล้วใน Javascript ได้อย่างไร?

4
ฉันจะเคลียร์ setInterval ภายในฟังก์ชันได้อย่างไร
โดยปกติฉันจะตั้งช่วงเวลาให้กับตัวแปรแล้วล้างออกเหมือนvar the_int = setInterval(); clearInterval(the_int);แต่เพื่อให้โค้ดของฉันทำงานฉันวางมันลงในฟังก์ชั่นนิรนาม: function intervalTrigger() { setInterval(function() { if (timedCount >= markers.length) { timedCount = 0; } google.maps.event.trigger(markers[timedCount], "click"); timedCount++; }, 5000); }; intervalTrigger(); ฉันจะล้างสิ่งนี้ได้อย่างไร ฉันให้มันยิงและพยายามvar test = intervalTrigger(); clearInterval(test);ที่จะให้แน่ใจ แต่นั่นไม่ได้ โดยทั่วไปฉันต้องการสิ่งนี้เพื่อหยุดเรียกเมื่อ Google แผนที่ของฉันถูกคลิกเช่น google.maps.event.addListener(map, "click", function() { //stop timer });

22
'dragleave' ขององค์ประกอบพาเรนต์ยิงเมื่อลากไปวางองค์ประกอบของเด็ก
ภาพรวม ฉันมีโครงสร้าง HTML ต่อไปนี้และฉันได้แนบdragenterและdragleaveกิจกรรมกับ<div id="dropzone">องค์ประกอบ <div id="dropzone"> <div id="dropzone-content"> <div id="drag-n-drop"> <div class="text">this is some text</div> <div class="text">this is a container with text and images</div> </div> </div> </div> ปัญหา เมื่อฉันลากไฟล์ไป<div id="dropzone">บนdragenterเหตุการณ์จะเริ่มทำงานตามที่คาดไว้ แต่เมื่อฉันเลื่อนเมาส์ของฉันมากกว่าองค์ประกอบลูกเช่น<div id="drag-n-drop">การdragenterจัดกิจกรรมที่เป็นเชื้อเพลิงสำหรับ<div id="drag-n-drop">องค์ประกอบแล้วdragleaveเหตุการณ์ถูกยิงสำหรับ<div id="dropzone">องค์ประกอบ หากฉันเลื่อนเมาส์ไปที่<div id="dropzone">องค์ประกอบอีกครั้งdragenterเหตุการณ์จะถูกยิงอีกครั้งซึ่งเยี่ยมยอด แต่จากนั้นdragleaveเหตุการณ์จะถูกไล่ออกสำหรับองค์ประกอบลูกเพิ่งออกไปดังนั้นremoveClassคำสั่งจะถูกดำเนินการซึ่งไม่เย็น พฤติกรรมนี้เป็นปัญหาด้วยเหตุผล 2 ประการ: ฉันก็แค่ติดdragenterและdragleaveไป<div id="dropzone">ดังนั้นผมจึงไม่เข้าใจว่าทำไมองค์ประกอบเด็กมีเหตุการณ์เหล่านี้ที่แนบมาด้วยเช่นกัน ฉันยังคงลาก<div id="dropzone">องค์ประกอบขณะโฉบเหนือลูกของมันดังนั้นฉันไม่ต้องการdragleaveยิง! jsFiddle นี่คือ jsFiddle เพื่อคนจรจัดด้วย: http://jsfiddle.net/yYF3S/2/ …

16
คุณตรวจจับการล้างอินพุต "ค้นหา" HTML5 อย่างไร
ใน HTML5 searchประเภทการป้อนข้อมูลจะปรากฏขึ้นพร้อม X เล็กน้อยทางด้านขวาที่จะล้างกล่องข้อความ (อย่างน้อยก็ใน Chrome หรือที่อื่น ๆ ) มีวิธีการตรวจสอบเมื่อมีการคลิก X นี้ใน Javascript หรือ jQuery นอกเหนือจากการพูดการตรวจพบเมื่อมีการคลิกที่กล่องทั้งหมดหรือทำตำแหน่งตรวจจับการคลิก (ตำแหน่ง x ตำแหน่ง / y)?

8
การใช้ Chrome วิธีค้นหาเหตุการณ์ที่ผูกพันกับองค์ประกอบ
สมมติว่าฉันมีลิงก์ในหน้าของฉัน: <a href="#" id="foo">Click Here</a> ฉันไม่รู้อะไรเลย แต่เมื่อฉันคลิกที่ลิงค์alert("bar")จะมีการแสดง #fooดังนั้นผมจึงรู้ว่าบางที่รหัสบางอย่างกำลังจะถูกผูกไว้กับ ฉันจะค้นหารหัสที่เชื่อมโยงalert("bar")กับเหตุการณ์คลิกได้อย่างไร ฉันกำลังมองหาวิธีแก้ปัญหาด้วย Chrome ป.ล. : ตัวอย่างเป็นเรื่องสมมติดังนั้นฉันไม่ได้มองหาวิธีแก้ปัญหาเช่น: "ใช้ XXXXXX และค้นหาโครงการทั้งหมดสำหรับ" alert (\ "bar \") "ฉันต้องการโซลูชันการแก้จุดบกพร่อง / การติดตามจริง

29
วิธีการตรวจหาจุดหยุดตอบสนองของ Twitter Bootstrap 3 โดยใช้ JavaScript
ปัจจุบัน Twitter Bootstrap 3 มีจุดพักการตอบสนองต่อไปนี้: 768px, 992px และ 1200px ซึ่งแสดงถึงอุปกรณ์ขนาดเล็กขนาดกลางและขนาดใหญ่ตามลำดับ ฉันจะตรวจหาเบรกพอยต์เหล่านี้โดยใช้ JavaScript ได้อย่างไร ฉันต้องการฟังด้วย JavaScript สำหรับกิจกรรมที่เกี่ยวข้องทั้งหมดที่เกิดขึ้นเมื่อหน้าจอเปลี่ยน และเพื่อให้สามารถตรวจสอบว่าหน้าจอเป็นอุปกรณ์ขนาดเล็กกลางหรือใหญ่ มีบางสิ่งที่ทำไปแล้ว? คุณมีข้อเสนอแนะอะไร?

7
จะจำลองการคลิกเมาส์ด้วย JavaScript ได้อย่างไร?
ฉันรู้เกี่ยวกับdocument.form.button.click()วิธีการ อย่างไรก็ตามฉันต้องการทราบวิธีจำลองonclickเหตุการณ์ ฉันพบรหัสนี้ที่ไหนสักแห่งที่ Stack Overflow แต่ฉันไม่รู้วิธีใช้ :( function contextMenuClick() { var element= 'button' var evt = element.ownerDocument.createEvent('MouseEvents'); evt.initMouseEvent('contextmenu', true, true, element.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 1, null); element.dispatchEvent(evt); } ฉันจะเริ่มกิจกรรมคลิกเมาส์โดยใช้ JavaScript ได้อย่างไร

20
ฉันจะจับการตอบสนองของ form.submit ได้อย่างไร
ฉันมีรหัสต่อไปนี้: <script type="text/javascript"> function SubmitForm() { form1.submit(); } function ShowResponse() { } </script> . . . <div> <a href="#" onclick="SubmitForm();">Click</a> </div> ฉันต้องการจับการตอบสนอง html ของform1.submit? ฉันต้องทำอย่างไร ฉันสามารถลงทะเบียนฟังก์ชันการโทรกลับไปยังเมธอด form1.submit ได้หรือไม่

7
ตัวสร้างเหตุการณ์ของ Internet Explorer 9, 10 & 11 ไม่ทำงาน
ฉันกำลังสร้างกิจกรรมใช้ตัวสร้างเหตุการณ์ DOM: new Event('change'); สิ่งนี้ทำงานได้ดีในเบราว์เซอร์ที่ทันสมัยอย่างไรก็ตามใน Internet Explorer 9, 10 & 11 มันล้มเหลวด้วย: Object doesn't support this action ฉันจะแก้ไข Internet Explorer (ผ่านโพลีฟิล) ได้อย่างไร? หากฉันไม่สามารถทำได้ฉันสามารถใช้วิธีแก้ไขปัญหาได้หรือไม่

21
ตรวจสอบคลิกเข้าสู่ Iframe โดยใช้ JavaScript
ฉันเข้าใจว่ามันเป็นไปไม่ได้ที่จะบอกว่าผู้ใช้กำลังทำอะไรภายในiframeถ้ามันเป็นข้ามโดเมน สิ่งที่ฉันต้องการจะทำคือการติดตามหากผู้ใช้คลิกiframeเลย ผมคิดว่าสถานการณ์ที่มีการมองไม่เห็นdivด้านบนของiframeและที่จะเพิ่งผ่านเหตุการณ์แล้วคลิกไปที่ diviframe เป็นไปได้อย่างนี้ไหม? ถ้าเป็นเช่นนั้นฉันจะไปเกี่ยวกับมันได้อย่างไร iframesโฆษณาดังนั้นผมจึงมีการควบคุมมากกว่าแท็กที่ใช้ไม่มี

4
จะทราบได้อย่างไรว่าเหตุการณ์ใดที่ JavaScript เริ่มทำงาน
ฉันมีรายการที่เลือก: <select id="filter"> <option value="Open" selected="selected">Open</option> <option value="Closed">Closed</option> </select> เมื่อฉันเลือกรีClosedโหลดเพจ ในกรณีนี้จะแสดงตั๋วปิด (แทนที่จะเปิด) ทำงานได้ดีเมื่อฉันทำด้วยตนเอง ปัญหาคือหน้าไม่โหลดซ้ำเมื่อฉันเลือกClosedด้วยWatir : browser.select_list(:id => "filter").select "Closed" ซึ่งโดยปกติหมายความว่าเหตุการณ์ JavaScript บางอย่างไม่ได้เริ่มทำงาน ฉันสามารถจุดไฟด้วย Watir: browser.select_list(:id => "filter").fire_event "onclick" แต่ฉันต้องรู้ว่าเหตุการณ์ไหนจะเกิดขึ้น มีวิธีค้นหาว่าเหตุการณ์ใดถูกกำหนดสำหรับองค์ประกอบหรือไม่?

8
Object.watch () สำหรับทุกเบราว์เซอร์?
โปรดทราบว่าObject.WatchและObject.Observeทั้งสองเลิกใช้งานแล้วในขณะนี้ (ณ มิ.ย. 2018) ฉันกำลังมองหาวิธีง่ายๆในการตรวจสอบวัตถุหรือตัวแปรสำหรับการเปลี่ยนแปลงและพบObject.watch()ว่ามันรองรับในเบราว์เซอร์ Mozilla แต่ไม่ใช่ IE ฉันจึงเริ่มค้นหารอบ ๆ เพื่อดูว่ามีใครเขียนเทียบเท่ากันบ้าง เกี่ยวกับสิ่งเดียวที่ฉันพบคือปลั๊กอิน jQueryแต่ฉันไม่แน่ใจว่านั่นเป็นวิธีที่ดีที่สุดหรือไม่ แน่นอนว่าฉันใช้ jQuery ในโครงการส่วนใหญ่ของฉันดังนั้นฉันจึงไม่กังวลเกี่ยวกับแง่มุมของ jQuery ... อย่างไรก็ตามคำถาม: ใครช่วยแสดงตัวอย่างการทำงานของปลั๊กอิน jQuery ให้ฉันดูได้ไหม ฉันมีปัญหาในการทำงาน ... หรือมีใครรู้ทางเลือกอื่นที่ดีกว่าที่จะทำงานข้ามเบราว์เซอร์ได้บ้าง? อัปเดตหลังคำตอบ : ขอบคุณทุกคนสำหรับคำตอบ! ฉันลองใช้รหัสที่โพสต์ที่นี่: http://webreflection.blogspot.com/2009/01/internet-explorer-object-watch.html แต่ดูเหมือนว่าฉันจะทำให้มันใช้งานกับ IE ไม่ได้ โค้ดด้านล่างทำงานได้ดีใน Firefox แต่ไม่ทำอะไรเลยใน IE ใน Firefox ในแต่ละครั้งที่watcher.statusมีการเปลี่ยนแปลงdocument.write()ในwatcher.watch()ที่เรียกว่าและคุณสามารถเห็นผลลัพธ์บนหน้าเว็บ ใน IE ไม่เกิดขึ้น แต่ฉันเห็นว่าwatcher.statusกำลังอัปเดตค่าเนื่องจากการdocument.write()เรียกครั้งสุดท้ายแสดงค่าที่ถูกต้อง (ทั้งใน IE และ FF) แต่ถ้าไม่ได้เรียกใช้ฟังก์ชันเรียกกลับแสดงว่าไม่มีจุดหมาย ... …


โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.