jQuery 选定的标签 ID?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5300071/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 18:56:00  来源:igfitidea点击:

Selected tab id?

jqueryjquery-uijquery-ui-tabs

提问by oshirowanen

I have the following script which gets the index of the selected tab:

我有以下脚本可以获取所选选项卡的索引:

http://jsfiddle.net/oshirowanen/eWncA/

http://jsfiddle.net/oshirowanen/eWncA/

Is it possible to get the id instead, if the li's had id's. If it is easier to get it from elsewhere, then that would also be fine, i.e. the related div tags, or somewhere else.

如果 li 有 id,是否有可能获得 id。如果从其他地方获取它更容易,那么也可以,即相关的 div 标签或其他地方。

回答by brendan

jQuery UI just adds a class to the selected li. You could just pull the li with the selected class out like this:

jQuery UI 只是向选定的 li 添加一个类。您可以像这样将所选类的 li 拉出:

   var id = $("li.tab.ui-tabs-selected").attr("id");

If you wanted to get one of the unselected tabs you could do something like this:

如果您想获取未选择的选项卡之一,您可以执行以下操作:

var id = $("li.tab:not(.ui-tabs-selected)").first().attr("id");

Working example:

工作示例:

http://jsfiddle.net/UBs9m/2/

http://jsfiddle.net/UBs9m/2/

回答by Eugene msc

var id = $("li.tab:eq("+selected+")").attr('id');

回答by nickb

If you're able to simply use the Tabs control's selectevent handler, this works fine:

如果您能够简单地使用 Tabs 控件的select事件处理程序,这可以正常工作:

$('#tabs').tabs({
    select: function( evt, ui ) {
        console.log( $(ui.panel).attr( 'id' ) );
    }
});

Also, here's a handy referencefor the different uiobject properties.

此外,这里是不同对象属性的方便参考ui

回答by Roeland Werring

If you are using jquery tabs (new version):

如果您使用的是 jquery 选项卡(新版本):

<div id="tabs">
        <ul>
            <li data-value="tab1"><a href="#tab1">Name of tab1</a></li>
            <li data-value="tab2"><a href="#tab2">Name of tab2</a></li>
        </ul>
        <div id="tab1">
        </div>
        <div id="tab2">
        </div>
 </div>       

 //get id in init
 $(function () {
    $("#tabs").tabs({
        activate: function(event ,ui) {
           var id = $(ui.newPanel).prop('id');
        }
      }
    );
 });
 var id = $("#tabs li.ui-state-active").attr('data-value'); //get id in other function

回答by billyonecan

If you're coming here via Google like myself, and are using jQuery UI 1.9.X, use the activateor beforeActivateevents to get the id:

如果您像我一样通过 Google 来到这里,并且使用 jQuery UI 1.9.X,请使用activatebeforeActivate事件获取id

$('selector').tabs({
  activate: function(e, ui) {
    var id = $(ui.newPanel).prop('id');
  }
});

Documentation

文档