单击对象内的区域时如何执行函数?(How to execute a function when clicking an area inside an object?)
我使用DOM-Elements创建了一个带有地图区域的对象。 现在我想在单击某个区域(坐标)时执行一个函数。 我想我也需要检查该区域是否被点击? 另外我觉得我在DOM-Element上缺少一些东西。
var _images = { //Object-MapArea start: { path: 'start.jpg', areas: [{ coords: '18,131,113,140', text: 'Homepage', onclick: doSomething, // ??? }] }, } // ..... there is more code not shown here //Creating DOM-Elements var areaElem = document.createElement('AREA'); // Set attributes areaElem.coords = area.coords; areaElem.setAttribute('link', area.goto); areaElem.setAttribute("title", area.text); areaElem.setAttribute("shape", "rect"); areaElem.onclick = doSomething; ? ? ? if (element.captureEvents) element.captureEvents(Event.CLICK); ? ? ? areaElem.addEventListener('click', onArea_click); _map.appendChild(areaElem); function doSomething(e) { if (!e) var e = window.event e.target = ... ? ? var r = confirm("Data will get lost!"); if (r == true) { window.open("homepage.html", "_parent"); } else { window.open(" ", "_parent"); // here I want to stay in the current pictures. I mean the current object map area. But how can I refer to it so it stays there ? } }I created an object with map Areas by using DOM-Elements. Now I want to execute a function when clicked on an area(coordinates). I think I also Need to check the area if it is clicked or not ? Also I think I'm missing something on the DOM-Element.
var _images = { //Object-MapArea start: { path: 'start.jpg', areas: [{ coords: '18,131,113,140', text: 'Homepage', onclick: doSomething, // ??? }] }, } // ..... there is more code not shown here //Creating DOM-Elements var areaElem = document.createElement('AREA'); // Set attributes areaElem.coords = area.coords; areaElem.setAttribute('link', area.goto); areaElem.setAttribute("title", area.text); areaElem.setAttribute("shape", "rect"); areaElem.onclick = doSomething; ? ? ? if (element.captureEvents) element.captureEvents(Event.CLICK); ? ? ? areaElem.addEventListener('click', onArea_click); _map.appendChild(areaElem); function doSomething(e) { if (!e) var e = window.event e.target = ... ? ? var r = confirm("Data will get lost!"); if (r == true) { window.open("homepage.html", "_parent"); } else { window.open(" ", "_parent"); // here I want to stay in the current pictures. I mean the current object map area. But how can I refer to it so it stays there ? } }最满意答案
查看我添加到您的代码中的评论;)
var _images = { //Object-MapArea start: { path: 'start.jpg', areas: [{ coords: '18,131,113,140', text: 'Homepage', clickHandler: doSomething // I changed the name to avoid confusion but you can keep onclick }] }, } // ..... there is more code not shown here //Creating DOM-Elements var areaElem = document.createElement('AREA'); // Set attributes areaElem.coords = area.coords; areaElem.setAttribute('link', area.goto); areaElem.setAttribute("title", area.text); areaElem.setAttribute("shape", "rect"); // Add a listener on click event (using the function you defined in the area object above) areaElem.addEventListener('click', area.clickHandler); // Add your other click handler areaElem.addEventListener('click', onArea_click); _map.appendChild(areaElem); function doSomething(e) { // Get the area clicked var areaClicked = e.target; // I dont understand the following code... var r = confirm("Data will get lost!"); if (r == true) { window.open("homepage.html", "_parent"); } else { window.open(" ", "_parent"); // here I want to stay in the current pictures. I mean the current object map area. But how can I refer to it so it stays there ? } }希望能帮助到你 ;)
See the comments I added to your code ;)
var _images = { //Object-MapArea start: { path: 'start.jpg', areas: [{ coords: '18,131,113,140', text: 'Homepage', clickHandler: doSomething // I changed the name to avoid confusion but you can keep onclick }] }, } // ..... there is more code not shown here //Creating DOM-Elements var areaElem = document.createElement('AREA'); // Set attributes areaElem.coords = area.coords; areaElem.setAttribute('link', area.goto); areaElem.setAttribute("title", area.text); areaElem.setAttribute("shape", "rect"); // Add a listener on click event (using the function you defined in the area object above) areaElem.addEventListener('click', area.clickHandler); // Add your other click handler areaElem.addEventListener('click', onArea_click); _map.appendChild(areaElem); function doSomething(e) { // Get the area clicked var areaClicked = e.target; // I dont understand the following code... var r = confirm("Data will get lost!"); if (r == true) { window.open("homepage.html", "_parent"); } else { window.open(" ", "_parent"); // here I want to stay in the current pictures. I mean the current object map area. But how can I refer to it so it stays there ? } }Hope it helps ;)
更多推荐
发布评论