3

次のhtmlコードがあります。

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

#gridStage は、小さな div #point が含まれる大きな div です。

ユーザーが をクリックした場合は正しい関数を呼び出し、ユーザーが ではなく#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 に答える