Question

当用户点击地图的一部分时，我尝试获取该部分的ID。

<img src="images/mapa.png"  alt="" width="588" height="711" usemap="#Map" />
<map name="Map" class="map">
  <area shape="circle" id="vrsac" coords="317,191,25" href="#">
  <area shape="circle" id="pancevo" coords="273,225,25" href="#">
  <area shape="rect" id="beograd" coords="195,247,251,276" href="#">
  <area id="lazarevac" shape="rect" coords="204,283,267,318" href="#">
</map>

$(document).ready(function(){
    $( ".map" ).click(function() {
        alert("Click: " + this.id);
    }); 
});

由于

解决

我将类添加到区域标记。

  <area class="qwe" shape="circle" id="vrsac" coords="317,191,25" href="#">

Answer 1

这里有两种选择。第一个是使用正确的选择器：您希望跟踪area代码的点击次数，而不是跟踪类map的某些元素。所以你的代码应该是：

$("area").click(function () {
    alert("Click: " + this.id);
});

或第二个，在效果方面更高效 - 将内部area代码中的点击事件委托给父map：

$("map").on('click', 'area', function () {
    alert("Click: " + this.id);
});

Answer 2

尝试从

更改jQuery选择器

$（＆＃34; .map＆＃34;）至 $（＆＃34; area＆＃34;）

Html地图对象 - 点击地图的部分获取ID

2 个答案: