我有一个 slideToggle，它给我一个 Accordion 式的功能。这一切都很好，除了第一次点击短暂显示内容 div 但然后立即将其滑动关闭。再次点击幻灯片正确打开，所有后续点击功能正常。
这是我正在使用的 Jquery 脚本:
$(".tm-section-label").click(function() {
$(this).parent().addClass('active').find('.tm-extra-product-options-container').slideToggle('fast,easing');
});~
$(".tm-section-label").click(function() {
$(".tm-section-label").not(this).parent().removeClass('active').find('.tm-extra-product-options-container').slideUp('fast');
});
这是我正在使用的 CSS:
.prodTabs div.cpf_hide_element {
display: none;
margin-bottom: 0;
}
.prodTabs.active > div.tm-extra-product-options-container {
visibility: visible;
height: auto;
opacity: 1;
}
.prodTabs.active div.cpf_hide_element {
display: block;
}
我怎样才能使初始点击只需滑动打开 div 而无需点击两次？
最佳答案
https://dotnetfiddle.net/hpJDeF
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.prodTabs div.cpf_hide_element {
display: none;
margin-bottom: 0;
}
.prodTabs.active > div.tm-extra-product-options-container {
visibility: visible;
height: auto;
opacity: 1;
}
.prodTabs.active div.cpf_hide_element {
display: block;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- Script to illustrates slideToggle() method -->
<script>
$(document).ready(function () {
$(".tm-section-label").click(function () {
$(this).parent().addClass('active');
var q = $(this).parent().find('.tm-extra-product-options-container');
if (q.hasClass('cpf_hide_element')) {
q.removeClass('cpf_hide_element');
}
else {
q.slideToggle('fast,easing');
q.removeClass('cpf_hide_element');
}
});
$(".tm-section-label").click(function () {
$(".tm-section-label").not(this).parent().removeClass('active').find('.tm-extra-product-options-container').slideUp('fast');
});
});
</script>
</head>
<body>
<div class="prodTabs" id="parent">
<div class="tm-extra-product-options-container cpf_hide_element" id="theContent">The content..</div>
<div class="tm-section-label">Click Me</div>
</div>
</body>
</html>
关于javascript - 如何防止 slideToggle 打开然后在第一次单击时关闭，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58240157/