Javascript 引导按类名查找活动选项卡内的元素显示事件。

我想在所示的引导选项卡事件中，在当前选项卡中找到类名为myelement的元素。 使用“.myelement”将提供我不需要的所有元素

HTML:

<div class="container">
  <ul class="nav nav-tabs">
    <li class="active"><a href="#home">Home</a></li>
    <li><a href="#menu1">Menu 1</a></li>
    <li><a href="#menu2">Menu 2</a></li>
    <li><a href="#menu3">Menu 3</a></li>
  </ul>

  <div class="tab-content">
    <div id="home" class="tab-pane fade in active">
      <h3>HOME</h3>
      <p class="myelement">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
    <div id="menu1" class="tab-pane fade">
      <h3>Menu 1</h3>
      <p  class="myelement">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
    </div>
    <div id="menu2" class="tab-pane fade">
      <h3>Menu 2</h3>
      <p  class="myelement">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
    </div>
    <div id="menu3" class="tab-pane fade">
      <h3>Menu 3</h3>
      <p  class="myelement">Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
    </div>
  </div>
</div>

---

“类别”选项卡窗格根据所选选项卡处于活动状态；利用它

$(".tab-pane.active .myelement"))

---

“类别”选项卡窗格根据所选选项卡处于活动状态；利用它

$(".tab-pane.active .myelement"))

找到了答案

$(".myelement",$(event.target).attr('href'));

找到了答案

$(".myelement",$(event.target).attr('href'));

---

步骤1：循环查看

li

元素，找到

活动元素的索引。
步骤2：使用计算出的索引访问内容

$(document).ready(function(){
$(".nav-tabs a").click(function(){
    $(this).tab('show');
});
$('.nav-tabs a').on('shown.bs.tab', function(event){
    var x = $(event.target).text();         // active tab
    var y = $(event.relatedTarget).text();  // previous tab
    console.log($(event.target));
    // Initialize index 
    var index = -1;
    // Find the index of active tabs
    var tabs = $(".nav li").each(function(i) {
        if(index === -1 && $(this).hasClass('active')) {
        index = i;
      }
    });
    // Access calculated index of active tab
    console.log($(".myelement")[index]); // Want to find this inside the selected tab.

});

}))
 步骤1：循环查看
li
元素，并找到
活动元素的索引。
步骤2：使用计算出的索引访问内容

$(document).ready(function(){
$(".nav-tabs a").click(function(){
    $(this).tab('show');
});
$('.nav-tabs a').on('shown.bs.tab', function(event){
    var x = $(event.target).text();         // active tab
    var y = $(event.relatedTarget).text();  // previous tab
    console.log($(event.target));
    // Initialize index 
    var index = -1;
    // Find the index of active tabs
    var tabs = $(".nav li").each(function(i) {
        if(index === -1 && $(this).hasClass('active')) {
        index = i;
      }
    });
    // Access calculated index of active tab
    console.log($(".myelement")[index]); // Want to find this inside the selected tab.

});

}))
 如果页面上有多个选项卡怎么办？此解决方案将失败，或者您可以将属性添加到锚定标记并相应地访问子项这是更新的fiddle链接如果页面上有多个选项卡怎么办？此解决方案将失败，或者您可以将属性添加到锚定标记并相应地访问子项。这是更新的fiddle链接。这不适用于单个页面中的多个选项卡。这不适用于单个页面中的多个选项卡。