如何判断当前打开了哪个选项卡？ Wet-Boew 插件

Question

我正在使用 Wet-boews 工具包中的选项卡式界面 (http://wet-boew.github.io/v4.0-ci/docs/ref/tabs/tabs-en.html)

页面加载后，如何确定打开了哪个选项卡。

我已经尝试了下面的方法，但奇怪的是它们都是 return 正确的

     <div class="wb-tabs">  
       <div class="tabpanels">      
          <details id="details-panel-panel1">
                <summary>Example 1</summary> 
                <p>                 ...             </p>        
         </details> 
        <details id="details-panel-panel2"> 
              <summary>Example 2</summary> 
               <p>              ...             </p>        
     </details>        </div>  </div>


var panel1 = ($("details-panel-panel1").attr("open")) ? true : false;
var panel2 = ($("details-panel-panel2").attr("open")) ? true : false;

Answer 1

两个提示：

要通过 id 获取元素，您需要在 id $('#details-panel-panel1')

#

$("#details-panel-panel1").attr("open") 会得到属性 open 的值，它不会告诉你是否存在（不是布尔值）。

说，我在文档中找不到任何内容，但我正在查看生成的代码，实际上您无法通过查看 open 属性来判断选项卡是否打开。但我注意到两件事：

属性 aria-expanded 在打开的选项卡上为真，在其余选项卡上为假。
打开的标签有classin，其他有out.

你可以任意选择：

$('#details-panel10').attr('aria-expanded') === "true"

或

$('#details-panel10').hasClass('in') === true

如何判断当前打开了哪个选项卡？ Wet-Boew 插件

How to tell which Tab is currently open? Wet-Boew plugin

jquery

jquery-plugins