javascript - There are multiple buttons on the interface. Clicking any button will pop up a prompt box. How to distinguish which button is clicked and which prompt box belongs to you?

Question

There are many buttons on the interface. Now the prompt box is displayed when the mouse is moved in, and disappears when the mouse is moved out. How to determine which button's move in and remove event is caused.
Can I write directly based on the wheelmenu.js ring menu?

Answer 1

To be honest, I don’t understand what you want to ask. Generally speaking, there are two commonly used methods to determine the target element:

One is to bind an event to each button, so that the elements corresponding to each corresponding event are relative.

The second is achieved through event delegation, and e.target is used to determine which button is triggered.

There is also a situation like in canvas. Since it is impossible to directly obtain whether each object in the canvas triggers an event, you need to use the observer mode to determine whether the mouse position is inside an object. As for detecting whether The ray method can be used inside the polygon.

Answer 2

Event delegation. Judge based on e.terget. Or use observer mode and use unique values ​​as parameters

Answer 3

General plug-ins will have a callback function. If so, you can reconstruct the callback
to delegate the click event to each btn to determine which btn it is

Answer 4

Delegation

Write the event in a container, such as p

<p id="pButtons">
    <p>
        //这里面放你的按钮些
    </p>
</p>

//写移动事件，把事件写在外层容器，不用考虑异步加载的问题
$('#pButtons').mousemove(function(e){
    e=e||window.event;
    //该对象为鼠标移动的时候，拿到的节点
    var target=e.target||e.srcElement;
    //判断该节点是否为按钮,节点名为大写
    if(target.nodeName=='BUTTON'){
        //$(target)就可以操作这个鼠标所在的按钮
    }
});

Answer 5

Event delegate evt.target