1

JQuery アコーディオンに次の動作を追加しようとしています。

1) 内部ページ リンク ( ) に基づいて、アコーディオンのセクションをアクティブにします#section1。これは、ユーザーが URL にアクセスした場合に、 mypage.com/page.php#testJS を使用してそのアコーディオン セクションをアクティブにすることを意味します。

2) アコーディオンの各セクションの見出しを、アコーディオンのそのセクションをアクティブにする URL へのコピー可能なリンクにします。したがって、ユーザーがアコーディオンの「セクション タイトル」を右クリックし、リンクの場所をコピーするとmypage.com/page.php#test、ユーザーのクリップボードに置かれます。


私は 1) を理解しましたが、それは私自身が書いたコードです。私はオプションをいじっていnavigation:trueましたが、運がありませんでした。誰かが私を正しい方向に向けたいと思うなら、私は自分のコードよりも作者のコードを使用したいと思いますが、そうでない場合は、これが完了しているので大したことはありません.

2)は私が途方に暮れているところです。JQuery アコーディオンは、アコーディオン セクションのヘッダーの任意の場所でクリック イベントにコードをバインドしているようです。これにより、私が望むリンクの場所をコピーする機能をユーザーに提供することができなくなっているようです。

私のHTML:

<div id="accordion">
   <article class="std_page_content">
    <h3><a id="#test">Test</a></h3>
    <div>
       test
    </div>
   </article>
   .....additional accordion sections....
</div>

私のJavascript:

$("#accordion").accordion({header : "h3", heightStyle : "content", /*Allows full collapse*/collapsible: true, /*collapses sections*/ active:false, navigation:true});

var theUrl = window.location.href;
var hashValue = theUrl.contains("#") ? theUrl.split('#')[1] : null;

if(hashValue != null)
{
    //open the corresponding accordion section
}
4

1 に答える 1

1

アンカータグに href 属性を与えるだけです:

<h3><a id="#test" href="#test">Test</a></h3>

更新: リンクでアコーディオン ヘッダー全体をカバーする場合は、次のように<h3>タグをアンカー タグ内に配置できます: http://jsfiddle.net/3tGYB/1/

<div id="accordion">
  <article class="std_page_content">
    <a id="#test" href="#test" class="header"><h3>Test</h3></a>
    <div>
      test
    </div>
  </article>
</div>

もちろん、JavaScript を変更します。

$("#accordion").accordion({header : "a.header" /*plus other options*/});
于 2013-02-04T19:07:05.037 に答える