0

我有一个改良的 Foundation 4 手风琴。我调整它的原因是我可以在我的部分标题中设置一个行/列，并在其中挤入一个额外的列。

所以代替这个：

<p class="title" data-section-title><a href="#">Section 1</a></p>

我有这样的事情：

<div class="row">
  <div class="large-10 columns">
    <p class="title" data-section-title><a href="#">Modified HTML (uses div.row)</a></p>
  </div>
  <div class="large-2 columns">
      <p>extra column</p>
  </div>
</div>

我的问题：没有阻止点击事件。

下面是演示：（我添加了向下滚动以演示单击 a-tag 跳回顶部。）

http://jsfiddle.net/pickledegg/nbJyu/4/

在正常情况下阻止点击的 javascript 在foundation.section.js 中。对于我的示例，它合并到了foundation.min，所以这里是实际的未缩小代码：

https://gist.github.com/pickledegg/5797197

4

1 回答 1

2

似乎是因为在javascript中

content = $this.siblings(self.settings.content_selector),

 if (!settings.deep_linking && content.length > 0) {
e.preventDefault();
}

上面的代码会阻止正常的点击行为。但是，在您修改后的代码中，您在 p 周围添加了 2 个带有 title 类的容器。为了使代码防止链接跟随，具有标题类的 p 和具有内容类的 div 必须是同级的。因此，我可能只是在此处将修改后的 id 添加到 html 中：

p class="title" id="modified" data-section-title=""><a href="#">Modified HTML (uses div.row)</a></p>

和javascript：

    $('#modified').click(function(event) {
event.preventDefault();
       });

为我工作:)

于 2013-06-17T14:58:58.787 回答