引导3手风琴崩溃不能在iphone上工作
这些“手风琴子菜单”在Chrome和Firefox中工作，但不在iPhone上。
我已经build立了一个网站，其中包括在较小的屏幕上的“offcanvas”导航菜单。 用户点击“热狗button”，导航菜单从左边滑到屏幕上…迄今为止效果很好。
一些导航元素包含子菜单。 对于那些，我使用bootstrap的手风琴标记。 用户点击一个箭头，“子菜单”展开。
问题
我在linux上开发使用chrome。 这个机制在Chrome浏览器，Firefox，以及我可以使用的每一个浏览器，以及我个人的android手机上都能很好地工作。 它也适用于responsinator.com 。 但是，由于我没有Safari，也没有iPhone，我没有能够直接在iPhone上testing这个function。 我正在努力获得一个iPhone模拟器…
在此之前，其他人已经在iPhone上看了这个，我被告知这个“子菜单”根本就不起作用。 当用户点击箭头时，没有任何反应
下面是包含“子菜单”的“菜单项”摘录：请注意我正在使用“数据切换”和“数据目标”属性：
<div class="panel panel-default"> <!-- The "Trigger" --> <div class="panel-heading"> <h4 class="panel-title"> <a href="view.php?cms_nav_id=1" name="about"> About</a> <a data-toggle="collapse" data-target="#collapse1"> <i class="pull-right icon-chevron-right mobile-nav-icon"></i> </a> </h4> </div> <!-- Populated submenus: --> <div id="collapse1" class="panel-collapse collapse"> <div class="panel-body"> <a href="view.php?cms_nav_id=7" name="ohioimprovementprocess">Ohio Improvement Process</a> </div> <div class="panel-body"> <a href="view.php?cms_nav_id=8" name="org/orgbeliefs">Organization Beliefs</a> </div> </div> </div><!-- /.panel --> 我真的不知道下一步该怎么做：类似的问题已经以“一个css冲突”或iphone问题结束.click() ，但我没有使用：我正在使用data-toggle/data-target 。 我正在考虑放弃'数据目标'的标记，而不是手动调用on('click', ... )事件，但我宁愿不要…
顺便说一下，如果这是相关的，我会在页面底部调用它：
<script src="/assets/dist/js/bootstrap.min.js"></script>
这是'bootstrap.js v3.0.0'。
有没有人有任何其他的线索？ 最近有没有像这样的问题的直接经验？
在此先感谢您的帮助。
所以我想我明白了这一点：我的原始标记完全依赖于数据目标元素，但这显然是不够的。 Safari（在iPhone上）似乎也需要href属性（它真的应该在<a> ，所以这是有效的：
<a data-toggle="collapse" data-target="#collapse1" href="#collapse1"> <i class="pull-right icon-chevron-right mobile-nav-icon"></i> </a>
但是这不是：
<a data-toggle="collapse" data-target="#collapse1"> <i class="pull-right icon-chevron-right mobile-nav-icon"></i> </a>
对我来说，崩溃可以在桌面和iphone上运行，但是我的一些崩溃在ipad上不起作用。 事实certificate，在@ Ryan的答案中@Loris给我提供了完美的解决scheme，将指针样式添加到任何可折叠的触发器（例如，一个作为button的div）。 我把它推广到下面的CSS：
[data-toggle~="collapse"] { cursor: pointer; }
看着这个，我有同样的问题，但是，当你添加一个href =“＃collapse1”，它跳转到页面的顶部。 我通过在一个button中包装元素来解决这个问题，并删除了button的CSS。 所以，你的代码是：
<button data-toggle="collapse" data-target="#collapse1"> <i class="pull-right icon-chevron-right mobile-nav-icon"></i> </button>
希望这可以帮助。
要使其适用于任何元素types（如div ，可以使用以下jQuery方法（testing的ios 8）：
<div class="collapse-header" data-target="#collapse_0"> Click this element... </div> <div id="collapse_0"> ...to collapse this element. </div> <script> $('.collapse-header').on('click', function () { $($(this).data('target')).collapse('toggle'); }); </script>
这对我有用：
$('.divClassName').on('click touchstart', function () { $($(this).data('target')).collapse('toggle'); });
您可以通过简单地将此属性添加到触发下拉列表的div来解决此问题。
cursor: pointer;