0

私は2つの部門を持っています。最初のものをクリックすると、ユーザーがdiv 'body' divのどこかをクリックすると、jquery showで2番目が切り替わります。

私の問題は、ユーザーが 'body' div のリンクをクリックすると、リンクが読み込まれる前にショーが実行されることです。最後のページで何かを見逃したと思うユーザーを混乱させます。「本文」div 内のリンクに対して単純な例外を作成することは可能ですか?

<div>
      <div class="body">
         <p>Some really good links</p>
         o Example Org: <a href="http://example.org">example.org</a><br>
         o Example Dotcom: <a href="http://example.com">example.com</a>
      </div>
      <div class="toggle" style="display: none;">
         <p>Some really detailed information here.</p>
      </div>
</div>

私のjavascriptは次のようになります:

<script>
$(document).ready(function () {
  bindToggle;
});

function bindToggle() {
    $(".toggle").hide();
    $(".body").click(function(event) {
        el = $(this).next();
        if (el.is(":visible")) {
            el.hide('fast');
        } else {
            el.show('fast');
        }
    });
};
</script>

ここにデモがあります：http://jsfiddle.net/esJsP/3/

4

1 に答える 1

1

本文のリンクをクリックして event.stopPropagation を呼び出すと、イベントが本文に到達するのを停止します。以下のコードを追加して、出力を確認します。

$('.body > a').click(function(e) {
    e.stopPropagation();
});

ここにデモがあります：http://jsfiddle.net/esJsP/5/

于 2012-12-12T16:29:44.933 に答える