我用加号和减号图像做了手风琴菜单。我的问题是加号和减号都无法正常工作。
html代码:
<div class="rightTitle">
<div class="multiAccordion" onclick="acc('acc0')" id="acc0">
<h3 class="rt">January</h3>
<div class="arrow"><a href="#"><img src="images/plus.png" alt="dropArrow" class="plu"/><img src="images/minus.png" alt="dropArrow" class="min" style="display:none;" /></a></div>
</div>
<div class="leaveDetails" style="display:none;">
<ul>
<li>15, Monday - <strong>Independence Day</strong></li>
<li>15, Monday - <strong>Independence Day</strong></li>
</ul>
</div>
</div>
<div class="rightTitle bt">
<div class="multiAccordion" onclick="acc('acc1')" id="acc1">
<h3 class="rt">Febuary</h3>
<div class="arrow"><a href="#"><img src="images/plus.png" alt="dropArrow" class="plu"/><img src="images/minus.png" alt="dropArrow" class="min" style="display:none;" /></a></div>
</div>
<div class="leaveDetails" style="display:none;">
<ul>
<li>15, Monday - <strong>Independence Day</strong></li>
<li>15, Monday - <strong>Independence Day</strong></li>
</ul>
</div>
</div>
<div class="rightTitle bt">
<div class="multiAccordion" onclick="acc('acc2')" id="acc2">
<h3 class="rt">March</h3>
<div class="arrow"><a href="#"><img src="images/plus.png" alt="dropArrow" class="plu"/><img src="images/minus.png" alt="dropArrow" class="min" style="display:none;" /></a></div>
</div>
<div class="leaveDetails" style="display:none;">
<ul>
<li>15, Monday - <strong>Independence Day</strong></li>
<li>15, Monday - <strong>Independence Day</strong></li>
</ul>
</div>
</div>
<div class="rightTitle bt">
<div class="multiAccordion" onclick="acc('acc3')" id="acc3">
<h3 class="rt">April</h3>
<div class="arrow"><a href="#"><img src="images/plus.png" alt="dropArrow" class="plu"/><img src="images/minus.png" alt="dropArrow" class="min" style="display:none;" /></a></div>
</div>
<div class="leaveDetails" style="display:none;">
<ul>
<li>15, Monday - <strong>Independence Day</strong></li>
<li>15, Monday - <strong>Independence Day</strong></li>
</ul>
</div>
</div>
这里我使用了这个jquery,
$(".multiAccordion").bind('click', function() {
$(this).next().toggle('slow', function() {
var a = $(this).next();
if (($(this).next()).is(':hidden'))//Please check whether if condition is rite or not
{
alert('hi')
$('.min').show();
$('.plu').hide();
} else {
alert('bye')
//$(this).next().hide('slow');
$('.min').hide();
$('.plu').show();
}
我的代码有问题吗?
如果是,请告诉我如何纠正它。
感谢。
答案 0 :(得分:0)
选择器$('.min')
和$('.plu')
会影响所有页面上的加号和减号,而不仅仅是您刚切换的那个。您可能应该使用$(this)
选择正确的加号/减号来切换,但很难说没有看到您的HTML结构。
答案 1 :(得分:0)
你肯定需要更多的背景。如果我能在黑暗中完全拍摄,我会说你可能会混淆$(这个)。下一个:
你在$(this).next上使用回调函数(),这样就成了新的“this”引用。