Javascript 移除动态添加到图像上的pin

我试图删除单击后的图像元素，该元素是使用jquery动态添加的。 该成果是一个简单的固定地图般的图像应用程序

HTML:

Javascript:

$(".imageMap").click(function(e){
    var offset = $(this).offset();
    var posLeft = e.clientX - offset.left;
    var posTop = e.clientY - offset.top;

    var pin = "<img onClick='javascript:removePin();' class='imgPin' src='pin.png'" + "style='width:auto;height:auto;position:absolute;left:" + posLeft + ";top:" + posTop + ";' />";
    $(".imageMapContainer").append(pin);    
});

function removePin(){
    //couldn't figure out here
}

$（“.imageMap”）。单击（函数（e）{
var offset=$（this.offset（）；
var posLeft=e.clientX-offset.left；
var posTop=e.clientY-offset.top；
var pin=“”；
$（“.imageMapContainer”）.append（pin）；
});
函数removePin（）{
//我在这里想不出来
}

我尝试了很多东西，但我想我不是一个有天赋的jscript人。

---

提前感谢。

在单击事件中，您可以添加

此

以发送对已单击元素的引用。 您可以在

removePin

函数中使用该引用，如：

$(".imageMap").click(function (e) {
    var offset = $(this).offset();
    var posLeft = e.clientX - offset.left;
    var posTop = e.clientY - offset.top;

    var pin = "<img onClick='javascript:removePin(this);' class='imgPin' src='pin.png'" + "style='width:auto;height:auto;position:absolute;left:" + posLeft + ";top:" + posTop + ";' />";
    $(".imageMapContainer").append(pin);
});

function removePin(elm) {
    $(elm).remove();
}

$（“.imageMap”）。单击（函数（e）{
var offset=$（this.offset（）；
var posLeft=e.clientX-offset.left；
var posTop=e.clientY-offset.top；
var pin=“”；
$（“.imageMapContainer”）.append（pin）；
});
功能移除PIN（elm）{
$（elm.remove（）；
}

在

$('.imageMapContainer').on('click', '.imgPin', function() { 
     $(this).remove(); 
});

---

@普特凡德：不，不工作）：看我的答案。希望对你有所帮助。内联

onClick

w/jQuery？不，请。这只是删除了我单击的一个，还是删除了imgPin类的所有PIN？仅删除了您单击的那个。

$('.imageMapContainer').on('click', '.imgPin', function() { 
     $(this).remove(); 
});