2

私はレストランの配達ウェブサイトに取り組んでおり、他のタブからタブ内にあるアンカータグをターゲットにする方法を見つけようとしています。たとえば、メインタブはメニュー、情報、レビューですが、メニュータブ内にあります。食べ物の種類（前菜、メインディッシュなど）を一覧表示するサブメニューが必要です。理想的には、それらすべてを一度に表示したいと思います。たとえば、[レビュー]から[デザート]をクリックした場合は、[メニュー]タブに移動します。デザートアンカー。

<ul class='tabs'>
<li><a href='#tab1'>Menu</a></li>
    <ul class="submenu">
       <?php foreach ($contents as $header_id => $item_array): ?>
       <li>
          <a href="#<?php echo $item_array[0]["content"] ?>"><?php echo $item_array[0]["content"] ?></a>
       </li>
      <?php endforeach; ?>
    </ul>
<li><a href='#tab2'>Info</a></li>
<li><a href='#tab3'>Reviews</a></li>
</ul>
4

2 に答える 2

0

タブ内にあるアンカー タグを他のタブからターゲットにするにはどうすればよいですか?

「セレクター、jQuery オブジェクト、または要素によってフィルター処理された、一致する要素の現在のセット内の各要素の子孫を取得するfind()」メソッドを使用してみてください。

$('ul.tabs li ul.submenu').each(function() {
    var anchors = $(this).find('a'); //these anchors are per sub menu.
});
于 2013-02-27T16:35:27.023 に答える
0

リンクをクリックしてあるタブから別のタブに切り替えるには、おそらくそれらのリンクにカスタム ハンドラーをアタッチする必要があります。

例えば：

HTML:

<li><a href="#" class="desertLink">Dessert</a></li>

JS:

$(".desertLink").click(function(){
  $( ".tabs" ).tabs( "option", "active", 1 );
  $( "html, body" ).animate({scrollTop:$('#dessert_id').position().top}, 'slow');
});

タブを [メニュー] タブから [情報] タブに切り替えます。

その他のオプションについては、http://api.jqueryui.com/tabs/#option-active でタブ API をご覧ください。

于 2013-02-27T16:40:54.257 に答える