Question

网页中有三个选项卡，而我通过操作提交的另一个网页则要转到包含选项卡的页面，我希望以编程方式单击（选中）第三个选项卡。如何实现？

Answer 1

从你的标签来看，我猜你正在使用jQuery-UI标签。在这种情况下，只需将“selected”选项设置为2。

$(selector).tabs({
   selected: 2
});

文档：http://jqueryui.com/demos/tabs/#option-selected

Answer 2

如果您使用的是jQuery，

$('#tabId').trigger('click');

Answer 3

您可以使用window.location.hash。例如，在index#tab页面上，它将是#tab。然后选择选项卡，如@Mike（如果您使用的是jQuery）或@alexanderb应答。

Answer 4

我尝试了你们所写的所有内容，但似乎代码没有用。所以我在这里给出了一些我的页面代码，也许有人可以给出正确的解决方案：

<script type="text/javascript">
    $(document).ready(  function()
                        {

                            // Lorsqu'un lien a.tab est cliqué
                            $("a.tab").click(   function () 
                                                {
                                                    // Mettre tous les onglets non actifs
                                                    $(".active").removeClass("active");
                                                    // Mettre l'onglet cliqué actif
                                                    $(this).addClass("active");

                                                    // Cacher les boîtes de contenu
                                                    $(".content").slideUp();
                                                    // Pour afficher la boîte de contenu associé, nous
                                                    // avons modifié le titre du lien par le nom de
                                                    // l'identifiant de la boite de contenu
                                                    var contenu_aff = $(this).attr("title");
                                                    $("#" + contenu_aff).slideDown();
                                                }
                                              );
                        }
                    );


</script>

<ul class="tabs">
    <li><a href="#" title="Informationg&eacute;n&eacute;rale" class="tab active">Information g&eacute;n&eacute;rale</a></li>
    <li><a href="#" title="Informationfinanci&egrave;re" class="tab">Information financi&egrave;re</a></li>
    <li><a href="#" title="Cr&eacute;dits" class="tab">Cr&eacute;dits</a></li>
</ul>
<div id="Informationg&eacute;n&eacute;rale" class="content">
<center>
<form action="suivi.php?action=AdminModificationFicheClient" method="post" name="frm_Fiche" id="frm_Fiche">

等...

那么如何从另一个页面以编程方式点击第三个标签？

Answer 5

您可以使用jQuery执行此操作，它将完全单击第三个选项卡。

 $('.TabClassName').get(2).click();

Answer 6

如果您想以编程方式重新加载选项卡，那么我建议使用如下所示的Jquery Tab API实用程序。它非常简单，更重要的是它还会引发直接单击制表符时通常会引发的事件。

//这使第一个标签处于活动状态，然后激活第二个标签

  $( "#myTabs" ).tabs( "option", "active", 0 );

此外，您还可以捕获下面的标签活动事件以执行任何操作

   $( "#myTabs" ).on( "tabsactivate", function( event, ui ) {

    // your custom code on tab click

   });

Answer 7

如果这是所有客户端代码，那么您可以使用查询字符串

在javascript中执行此操作

window.location = "http://www.somepage.com/?activetab=3"

然后在带有

标签的页面上

$document.read(function(){
 var activeTab = getParameterByName(activeTab);

$("#youtabs").tabs({
   selected: activeTab 
});
})

function getParameterByName(name) {     
    var match = RegExp('[?&]' + name + '=([^&]*)')
                    .exec(window.location.search);

    return match ?
        decodeURIComponent(match[1].replace(/\+/g, ' '))
        : null;     
}

这假设您使用的是jquery UI选项卡控件。

如何以编程方式单击选项卡？

7 个答案: