手风琴不允许打开链接

Question

下面是我用于手风琴的一些js。当我点击一个LI时，它会像应该的那样打开，但问题是，如果我在那个打开的区域中有链接，当我试图点击它们时，它就会关闭。

李如何保持开放，以便我可以点击链接？

$(document).ready(function(){
$('.accordion-list > li > .answer').hide();

$('.accordion-list li').click(function() {
if ($(this).hasClass("active")) {
$(this).removeClass("active").find(".answer").slideUp();
} else {
$(".accordion-list > li.active .answer").slideUp();
$(".accordion-list > li.active").removeClass("active");
$(this).addClass("active").find(".answer").slideDown();
}
return false;
});

});

如果有帮助的话，下面是手风琴html：

<ul class="accordion-list">
<li class="section1 show">
<h4>Data Sheets</h4>
<div class="answer">
<div class="data-sheets">
<p><a href="https://yahoo.com">Yahoo</a></p>
<p><a href="https://google.com">Google</a></p>
</div>
</div>
</li>
<li class="section2 show">
<h4 class="title">Manuals</h4>
<div class="answer">
<div class="manuals">
<p><a href="https://yahoo.com">Yahoo</a></p>
<p><a href="https://google.com">Google</a></p>
</div>
</div>
</li>
</ul>

Answer 1

你的问题是，点击链接也会触发点击li。所以你必须获取点击链接并停止传播。

看看这个小提琴

对不起，第一把小提琴是空的。

$(document).ready(function(){
$('.accordion-list > li > .answer').hide();
$('.accordion-list li').click(function() {
if ($(this).hasClass("active")) {
$(this).removeClass("active").find(".answer").slideUp();
} else {
$(".accordion-list > li.active .answer").slideUp();
$(".accordion-list > li.active").removeClass("active");
$(this).addClass("active").find(".answer").slideDown();
}
return false;
});
$('a').click(function(event)
{
event.stopPropagation();
console.log($(this).attr('href'))
})
});

https://jsfiddle.net/yc6esxv0/