2

現在、jQuery アコーディオンには 5 つのタブがあります。それらをクリックすると、コンテンツが期待どおりに表示されます。ただし、外部サイトへのリンクも含めたいと思います。スタイルを維持するために、アコーディオンのようにも見えるようにしたいと思います. コンテンツに「ここをクリック」というリンクを含めることもできますが、外部リンクだけにした方がよいでしょう。UI ウィジェットを使用し、アコーディオンからスタイルを追加して一致させることができましたが、2 つの問題が発生しました。1 つ目は、UI-Widget タブがアコーディオン タブのようなマウス オーバー効果を行わないことです。2 つ目は、UI-Widget タブのテキストが他のタブと整列しないことです (ブラウザでテキスト サイズを大きくした場合も同様です)。

<a href="http://apple.com/">
<div class="ui-widget" style="margin: 0px 20px;">
    <div class="ui-state-default ui-corner-all" style="margin: 0px; padding: .5em;">
        <h3 class="ui-helper-reset" role="tab" aria-expanded="false" aria-selected="false" tabindex="-1"><span class="ui-icon ui-icon-extlink" style="float: left;"></span><a href="#">Apple</a></h3></div>
</div>
</a>
4

1 に答える 1

1

click1 つの方法は、別のイベントを link 要素に添付することです。

$("#linkId").click(function() {
    window.location.href = "http://apple.com/";
});

このようにして、残りの機能は同じままで、外部リンクを取得できます。詳細については、 jsFiddleを参照してください。

アップデート

clickこのリンクの既定のアコーディオン動作が必要ない場合は、それに影響を与える可能性のある他のすべてのイベントをオフにすることができます。何かのようなもの：

$("#linkId").parentsUntil("#accordion").off("click");

jsFiddleを参照してください。

于 2012-08-13T00:39:42.480 に答える