<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="form-group">
    <a for="collapseOne" data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne" class="btn btn-primary">+ addInfo </a>
    <textarea class="form-control collapse" id="collapseOne" rows="4"></textarea>
</div>

<div class="form-group">
    <a for="collapseTwo" data-toggle="collapse" href="#collapseTwo" aria-expanded="true" aria-controls="collapseOne" class="btn btn-info">+ subtitle </a>
    <input type="text" class="form-control collapse" id="collapseTwo">
</div>

问题是,单击addInfo选项卡时,您可能会发现展开text_area时出现 skip ,即动画不平滑.

推荐答案

如果其他人遇到这个问题,就像我刚才所说的,答案是将您想要折叠的内容包装在div内,并折叠包装器div,而不是内容本身.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="form-group">
    <a for="collapseOne" data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne" class="btn btn-primary">+ addInfo</a>
    <div id="collapseOne" class="collapse">
        <textarea class="form-control" rows="4"></textarea>
    </div>
</div>

<div class="form-group">
    <a for="collapseTwo" data-toggle="collapse" href="#collapseTwo" aria-expanded="true" aria-controls="collapseOne" class="btn btn-info">+ subtitle</a>
    <input type="text" class="form-control collapse" id="collapseTwo">
</div>

Jquery相关问答推荐

:eq Jquery,我似乎无法显示第一个之后的元素

Jquery 表数据无法在 html 上正确显示

JQuery - 从先前 Select 的下拉列表中隐藏/显示选项

jQuery 1.4.1 中缺少 JSON 字符串化?

如何以十六进制获取元素的背景 colored颜色 代码?

jQuery ajax() 使用成功、错误和完成与 .done()、.fail() 和 always()

如何设置缓存:jQuery.get 调用中的 false

Ajax 更新后在 jQuery 中重新绑定事件(更新面板)

jQuery UI 滑块(以编程方式设置)

在 HTML 表单提交上制作 Enter 键而不是激活按钮

Bootstrap 3.0 弹出框和工具提示

延期与promise

将每 3 个 div 包装在一个 div 中

jQuery Select 器中前导冒号的目的是什么?

查找 id 以开头的 html 元素

jQuery empty() 与 remove()

单击时平滑滚动到特定的 div

jQuery - 从元素内部 Select 元素

请求的资源错误中不存在Access-Control-Allow-Origin标头

如何以编程方式触发 ngClick