0
  • 私のすべての要素は絶対に配置されています
  • item2はitem1に含まれています
  • item2をクリックすると、デフォルトの動作はitem2のクリックを実行してからitem1のクリックを実行することです。
  • item2をクリックしたときにitem1で実行されるアクションをなんとかして防ぐことができますか？

フィドルのitem2をクリックしてください

私のフィドル：

http://jsfiddle.net/z9Unk/59/

HTML

<div class="item1">
  item1
</div>
<div class="item2">
    item2
</div>
<div class="item3">
    item3
</div>

CSS：

item1 {
    position:absolute;
    width:150px;
    height:150px;
    background-color:red;
    top:5%;
}

.item3, .item2 {
    position:absolute;
    width:50px;
    height:50px;
    background-color:green;
    top:8%;
    left:1%;
    display:none;
}

.item3 {
    top:18%;
}

JS：

var item1 = $(".item1");
var item2 = $(".item2");
var item3 = $(".item3");

item1.hover(
    function() {
      item2.show();
      item3.show();
    },
    function() {
      item2.hide();
      item3.hide();
    }

);

item2.hover(
    function() {
      item3.hide();
    },
    function() {
    }

);

item2.click(
    function() {
        alert("Perform some function");
    }
);

item1.click(
    function() {
        alert("Perform item1 function");
    }
);
4

2 に答える 2

1

単にfalseを返します：

item2.click(
    function() {
        alert("Perform some function");
        return false;
    }
);

item1.click(
    function() {
        alert("Perform item1 function");
        return false;
    }
);

これを読んでください：「falseを返す」とは何ですか。行う？

于 2013-02-22T02:03:32.863 に答える
1

イベントがDOMツリーをバブリングするのを防ぎ、親ハンドラーにイベントが通知されないようにすることができます。

DOMレベル3イベント：stopPropagation

IE6-8はreturn false、イベントハンドラーまたはwindow.event.cancelBubble = true

jqueryを使用する場合event.stopPropagation、すべてのブラウザで使用できます

于 2013-02-22T02:12:29.573 に答える