问题
I have a canvas tag to create a graphic. At each section of my line, I have a "dot" to enable a 'mouseover' and display more detail.
Everything works fine when I don't add an event listener to this dot.
Firebug is warning me : s.addEventListener is not a function...
Is it possible to create dynamic event listener? (I'm new to Javascript)
回答1:
You cannot attach DOM events to things other than DOM objects (elements). The canvas
is a DOM element, the things you are drawing to the canvas are not. They become a part of the canvas as pixels of an img.
In order to detect a click on a specific point on your canvas you must attach the click event on the canvas element, and then compare the x/y coordinates of the click event with the coordinates of your canvas.
This was answered in: "How do I get the coordinates of a mouse click on a canvas element?"
回答2:
If you're gonna be drawing basic structures, I suggest you make use of inline svg.
In this case, all the svg elements become DOM elements and you can attach separate events to each of them.
来源:https://stackoverflow.com/questions/1532739/addeventlistener-in-canvas-tag