0
我有這種手風琴，我希望整行都是可點擊的，但是當我點擊它時，焦點被設置迴應用程序的頂部。我正在使用該標籤，以便在移動設備上使用鍵盤時，它將獲得焦點。有沒有辦法讓焦點停留在行而不是頂端？如何關注Boostrap手風琴
<div id="accordion" class="panel-group">
<div class="panel panel-default">
<div class="panel-heading" data-target="#content1">
<h2 class="panel-title" title="hidden content closed">
<a href="#content1">
<span aria-hidden="true">Milky Way Black Hole Belches</span>
<span class="glyphicon glyphicon-chevron-down pull-right"></span>
</a>
</h2>
</div>
<div id="content1" class="panel-collapse collapse">
<div class="panel-body">
The monster back hole at the center of the Milky Way belched out an exceptionally high number of powerful X-ray flares in August 2014, did the beast chow down on a passing gas cloud, or is this typical for black holes? </span>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" data-target="#content2">
<h2 class="panel-title" title="hidden content Closed" >
<a href="#content2">
<span aria-hidden="true">Tiny Pluto Moon Kerberos Unveiled</span>
<span class="glyphicon glyphicon-chevron-down pull-right"></span>
</a>
</h2>
</div>
<div id="content2" class="panel-collapse collapse">
<div class="panel-body">
Newly received photos captured by NASA's New Horizons spacecraft reveal that Pluto's tiny moon Kerberos is smaller and brighter than researchers had expected.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" data-target="#content3">
<h2 class="panel-title" title="hidden content Closed">
<a href="#content3">
<span aria-hidden="true">New Horizons Pluto Probe Heads Toward 2nd Flyby Target</span>
<span class="glyphicon glyphicon-chevron-down pull-right"></span>
</a>
</h2>
</div>
<div id="content3" class="panel-collapse collapse">
<div class="panel-body">
New Horizons, which in July performed the first-ever flyby of Pluto, fired up its engines yesterday (Oct. 22) in the first of four maneuvers designed to send the probe zooming past a small object called 2014 MU69 on Jan. 1, 2019. </span>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" data-target="#content4">
<h2 class="panel-title" title="hidden content Closed">
<a href="#content4">
<span aria-hidden="true">Ingredients for Life Were Always Present on Earth, Comet Suggests </span>
<span class="glyphicon glyphicon-chevron-down pull-right"></span>
</a>
</h2>
</div>
<div id="content4" class="panel-collapse collapse">
<div class="panel-body">
Astronomers detected 21 different complex organic molecules streaming from Comet Lovejoy during its highly anticipated close approach to the sun this past January. Many of these same compounds have also been spotted around newly forming stars
</div>
</div>
</div>
</div>
的JavaScript
<script>
$(document).ready(function() {
$('.panel-heading').click(function(){
var target = $(this).data("target");
$('#accordion').on('show.bs.collapse', function() {
$('#accordion .in').collapse('hide')
$(this).attr('title', 'hidden content closed');
});
$(target).collapse('toggle')
$(this).attr('title', 'hidden content open');
});
});
$('.collapse').on('shown.bs.collapse', function(){
$(this).parent().find(".glyphicon-chevron-down").removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up");
}).on('hidden.bs.collapse', function(){
$(this).parent().find(".glyphicon-chevron-up").removeClass("glyphicon-chevron-up").addClass("glyphicon-chevron-down");
});
$(".collapse").on('hide.bs.collapse', function(){
var title = $(this).parents('div.panel').find('.panel-title')[0];
var titleText = $(title).text();
$(title).attr('title',titleText+' hidden content closed');
});
$(".collapse").on('show.bs.collapse', function(){
var title = $(this).parents('div.panel').find('.panel-title')[0];
var titleText = $(title).text();
$(title).attr('title',titleText+' hidden content open');
});
</script>
<!-- Add text to open\close menu button -->
<script>
$('.navbar-collapse').on('shown.bs.collapse', function() {
$(this).parent().find(".navbar-toggle").attr('title', 'dropdown menu open');
}).on('hidden.bs.collapse', function() {
$(this).parent().find(".navbar-toggle").attr('title', 'dropdown menu closed');
});
</script>