0

我有两个div。当用户单击 div 'body' div 上的任意位置时，单击第一个会使用 jquery show 切换第二个。

我的问题是，当用户单击“body”div 中的链接时，节目会在链接加载之前执行。它会让那些认为他们错过了最后一页内容的用户感到困惑。是否可以为“body”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 回答