您好我有一个隐藏产品信息的产品列表,并且使用jquery来下载点击信息。问题是我想要上一个。用户点击其他产品时向上滑动的信息。
我让它关闭前一个,但它不会打开下一个。
以下是用户点击的链接以获取更多信息。
<div class="list-op" target="<?php echo $i ?>" style="display:inline;"></div>
以下是hiden divs
<div id="div<?php echo $i ?>" class="targetDiv" style="display:none">
<div class="list-image">
<a href="<?php echo $_product->getProductUrl() ?>" class="product-image" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>">
<img class="tTip" src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(140, 183); ?>" width="140" height="183" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>">
</a>
</div>
</div>
这是我的事件的jquery代码
jQuery(function ($) {
$('.list-op').click(function () {
var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.
//Show the element if nothing is shown.
if ($('.aktiv').length === 0) {
$(itemid).slideToggle("slow");
$(itemid).addClass('aktiv');
//Hide the element if it is shown.
} else if (itemid == "#" + $('.aktiv').attr('id')) {
$('.aktiv').slideToggle("slow");
$(itemid).removeClass('aktiv');
//Otherwise, switch out the current element for the next one sequentially.
} else {
$('.aktiv').slideToggle(function () {
$(this).removeClass('aktiv');
if ($(".targetDiv:animated").length === 0) {
$(itemid).slideToggle("slow");
$(itemid).addClass('aktiv');
}
});
}
});
});
答案 0 :(得分:1)
尝试将您的jquery更改为:
jQuery(function ($) {
$('.list-op').click(function () {
var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.
// this is already shown
var stop = $(itemid).hasClass('aktiv')
$('.aktiv').slideToggle("slow").removeClass('aktiv');
if(stop) return;
$(itemid).slideToggle("slow").addClass('aktiv');
})
});