Question

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

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>

Answer 1

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

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

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

jQuery(function($){

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

    // Remainder of your code...

});

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

的更新 的

根据您提供的网址，以下内容适用于我：

<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>

Answer 2

使用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);
     });

jQuery工具选项卡 - 从另一个文本链接链接到选项卡？

2 个答案: