0

私は改良された基礎 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 つのコンテナーを追加します。コードがリンクのフォロースルーを防止するには、タイトル クラスの 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 に答える