javascript - 防止双击图像地图区域

Question

我有一个基本的图像映射，当单击一个区域时，它会执行一个 javascript/jquery 例程。此时，DoStuff()如果双击该区域，该方法将执行两次。任何人都可以提供一种方法来防止双击场景中的双重执行吗？

<img src="images/myimage.png" border="0" usemap="#Map1" />
<map name="Map1">
    <area coords="5,115,97,150" href="javascript:void(0);" onclick="DoStuff()">
    <area coords="104,116,199,149" href="javascript:void(0);" onclick="DoStuff()">
</map>

Answer 1

使用布尔标志。

var hasBeenClicked = false;

// Your code...

if(!hasBeenClicked){
    hasBeenClicked = true;

    // My routine

    setTimeout(function(){ // McPhelpsius's idea (wait for 1sec before we can click again)
        hasBeenClicked = false; // My routine is over, we can click again
    }, 1000);
 } else {
    // do nothing 
 }

Answer 2

如果您使用的是 jQuery，您可以在点击处理程序的顶部包含它。单击时，它将禁用阻止任何单击事件发生的元素。

function DoStuff() {
    $('[name="Map1"]').prop('disabled', true);
    //Do Stuff..
}

这根据您的 jQuery 版本解释了一些其他选项。