Question

使用Bootstrap选项卡标记我试图显示可折叠的菜单/手风琴，如果窗口小于768px。

每当<tab-content>为<ul nav-tabs>时，每个<li active>都需要向内移动。我已设法将其附加到第一个<ul nav-tabs> <li active>，但在单击每个<ul nav-tabs> <li active>时我无法移动它。的即。只有第一个标签可以使用

如何在每个<tab-content>点击每个<ul nav-tabs> <li active>后附加<div role="tabpanel" id="tabs-test">  <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li> <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li> <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li> <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li> </ul>  <div class="tab-content-outer"> <div class="tab-content"> <div role="tabpanel" class="tab-pane active" id="home">It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div> <div role="tabpanel" class="tab-pane" id="profile">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div> <div role="tabpanel" class="tab-pane" id="messages">The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.</div> <div role="tabpanel" class="tab-pane" id="settings">The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.</div> </div> </div> </div> 个活动{/ 1}}。

Click for demo

{{1}}

应该是一个简单的修复，但我被卡住了！任何帮助非常感谢。

Answer 1

使用 .addClass（）而不是 append（）或 appendTo（）。

AppendTo（）将匹配元素集中的每个元素插入到目标的末尾。

示例：

<h2>Greetings</h2>
<div class="container">
  <div class="inner">Hello</div>
  <div class="inner">Goodbye</div>
</div>
$( ".inner" ).append( "<p>Test</p>" );

您可以创建内容并一次将其插入多个元素中。

我改变了你的例子：

https://jsfiddle.net/DTcHh/5693/ 它工作正常，但你需要配置你的CSS

<强>来源：

http://api.jquery.com/append/ http://api.jquery.com/addclass/

在jquery中使用.append的问题

1 个答案: