javascript - Using Jquery to determine two DIV events at the same time

Question

Use jQuery to determine that the mouse has moved out of p1 and p2 at the same time and then trigger the alert('abc'); event!

How to achieve

Answer 1

Then use bind multiple events. Why not use the native addEventlistner? It supports everything natively. jq operation is also based on this.

Answer 2

1. Place two p's on the same p and add a mouse out event on p3.

<p class='p3'>
    <p class="p1"></p>
    <p class="p2"></p>
</p>

2. If the mouse comes out of p1 or p2 and the mouse does not enter p1 or p2 within 0.5 seconds, the method will be triggered. If entered within 0.5 seconds, the timer will be cleared and the method will not be triggered!

var timer=null;
odvi1.onmouseover=odvi2.onmouseover=function () {
    clearTimeout(timer);
}
odvi1.onmouseout=odvi2.onmouseout=function () {
    timer=setTimeout(function () {
        alert("abc");
    },500)
}

Answer 3

First of all, you should declare the relationship between the two p. It is best to post code or pictures so that others can respond to your questions.

Secondly, what you should ask is the idea of ​​​​solving this problem, rather than hoping that others will write the solution code and then copy use it.

You need to learn how to clarify your thoughts and solve problems, which will help your growth.

Answer 4

The idea is to bind events to the document, and use event delegation to query whether the mouse is on p1 or p2,

if -> true 
// BiBi
else -> false
// BiBi