3

我有以下html代码：

<div id="gridStage">
   <div id="point1" class="point rounded-corners">
   </div>
</div>

#gridStage 是一个较大的 div，其中包含一个较小的 div #point。

如果用户点击，我想调用一个正确的函数，如果用户点击任何地方而不是 on ，我想调用#point另一个错误的函数。#gridStage#point

问题是当用户点击时#point，jQuery 也会检测到点击，#gridStage结果这两个函数都被调用，这不是必需的。

目前我可以使用以下代码来做到这一点：

var pointClick=0;
$(".point").click(function() {
var pointClick=1;
    correct();
    setTimeout(function() {
       pointClick=0;
    },1000);
});
$("#gridStage").click(function() {
setTimeout(function() {
       if(pointClick===0) {
           wrong();
       }
    }, 500);
});

但我知道这是一种低效的方式，那么还有其他好的解决方案吗？

注意：我想要做的就是我有一个网格作为图像，然后我在它上面覆盖一个 div 并且我想检测用户是否点击了正确的点，为此我在正确的点上放置了一个 div覆盖网格的顶部，现在我必须检测他的点击是否在正确的点上。因此，如果您对此有更好的布局，除了我使用的上述布局，您可以自由提出建议。

4

1 回答 1

6

您需要停止传播。

$(".point").click(function(e) {
    correct();
    e.stopPropagation();
});
$("#gridStage").click(function() {
    wrong();
});

（注意e行上的参数$(".point").click(function(e) {和e.stopPropagation();）

于 2012-06-05T11:04:21.943 回答