以下代码利用 Bootstrap 的data-toggle="collapse"执行单击已配置元素时折叠/展开的功能，在本例中，单击parent1和parent2
**问题：**点击parent元素时，崩溃在我的PC上使用Chrome和Firefox浏览器工作，但在我的iPad上使用Safari浏览器不工作。
<div id="parent1" type="button" class="parentclass" data-toggle="collapse" data-target="#childof1">
<strong>Technologies </strong>
</div>
<div id="childof1" class="collapse">
<!-- elements of child1 -->
</div
<div id="parent2" type="button" class="parentclass" data-toggle="collapse" data-target="#childof2">
<strong>Vertical </strong>
</div>
<div id="childof2" class="collapse">
<!-- elements of child2 -->
</div参考文件：http://www.w3schools.com/bootstrap/bootstrap_ref_js_collapse.asp
1条答案
按热度按时间92dk7w1h1#
我尝试在单击展开/折叠的父元素中使用
<a>而不是<div>，即并更新了
parentclass的样式，使其具有display: block;，并在iPad中进行了测试，现在它也可以从iPad Safari浏览器工作！**更新1：**看到一个帖子建议使用
href来让iPhone中的Safari能够理解，但我不确定是否也必须使用这个属性，因为当我使用href进行测试时，每次我触摸parent的页眉，页面都会给人一种刷新[页面移动]的印象。所以我认为不需要href。更新2
使用
<button>而不是<a>更新，因此可以轻松排除href的预期。输出仍如预期，在Chrome、Firefox以及Safari中工作。请建议这是否是正确的方法或是否有任何替代修复方法
关于
data-toggle和data-*的更多信息：The data-toggle attributes in Twitter Bootstrap