0

我正在使用 jQuery 工具选项卡...我需要从同一页面上的单独链接打开选项卡。这是我正在尝试的代码。

jQuery(function($){

        $('#accord1trig').click(function(){
              $(".accordion").tabs('selected', 1);
        });

        $('#accord2trig').click(function(){
              $(".accordion").tabs('selected', 2);
        });

        $('#accord3trig').click(function(){
              $(".accordion").tabs('selected', 3);
        });

        $('#accord4trig').click(function(){
              $(".accordion").tabs('selected', 4);
        });

});

html如下

<a href="#" id="accord1trig">Tab Link 1</a>
<a href="#" id="accord2trig">Tab Link 2</a>
<a href="#" id="accord3trig">Tab Link 3</a>
<a href="#" id="accord4trig">Tab Link 4</a>
4

2 回答 2

1

假设您的“单独链接”是：

<a href="#" id="click-me">Click me</a>

并且您希望它打开“Tab Link 1”，您可以将.click()脚本中的第一个 jQuery 更改为：

jQuery(function($){

    $('#accord1trig, #click-me').click(function(){
          $(".accordion").tabs('selected', 1);
    });

    // Remainder of your code...

});

看看我是如何用逗号分隔并添加#click-me到那里的选择器的？

更新：

根据您提供的 URL，以下内容对我有用：

<script type='text/javascript'>
jQuery(function(){
    jQuery('h4 a[data-tab]').click(function(e){
        e.preventDefault();
        var tab = jQuery('.accordion-toggle:eq(' + (parseInt(jQuery(this).data('tab')) - 1) + ')');
        tab.triggerHandler('click').addClass('current');
    });
});
</script>
于 2012-11-12T20:50:32.890 回答
0

使用 e.preventDefault() 停止默认操作。您还可以将代码压缩为单个事件处理程序..

添加 HTML-5 数据属性以存储选项卡信息..

HTML

<a href="#" id="accord1trig" data-tab="1">Tab Link 1</a>
<a href="#" id="accord2trig" data-tab="2">Tab Link 2</a>
<a href="#" id="accord3trig" data-tab="3">Tab Link 3</a>
<a href="#" id="accord4trig" data-tab="4">Tab Link 4</a>

Javascript

$('#accord1trig ,#accord2trig ,
                #accord3trig ,#accord4trig  ').on('click' , function(){

       var tab = parseInt( $(this).data('tab') , 10) ;
       $(".accordion").tabs('selected', tab);
 });

或者简单地说

 $('[id^="accord"]').on('click' , function(){

           var tab = parseInt( $(this).data('tab') , 10) ;
           $(".accordion").tabs('selected', tab);
     });
于 2012-11-12T21:02:29.420 回答