如何解决需要帮助关闭同一页面上的多个打开的手风琴项目但不同的部分
我想弄清楚如何在同一页面上关闭所有其他打开的手风琴项目。我使用 Divi 作为我的 Wordpress 网站的主题。 Divi 已经具有一次打开一个手风琴项目的能力,但是如果同一页面上还有另一个手风琴项目,它不会关闭该页面上最后一个打开的手风琴项目。我似乎无法找到有关如何在线解决此问题的任何答案,否则使用 JQuery 是解决此问题的最佳方法。我对 JQuery 还很陌生,所以我不确定我是否遗漏了什么,或者我的代码是否没有按预期工作。
HTML 示例:
<div class="et_pb_module et_pb_accordion et_pb_accordion_2 ally-faq">
<div class="et_pb_toggle et_pb_module et_pb_accordion_item et_pb_accordion_item_10 et_pb_toggle_close">
<h5 class="et_pb_toggle_title">Your Title Goes Here</h5>
<div class="et_pb_toggle_content clearfix"></div>
</div>
<div class="et_pb_toggle et_pb_module et_pb_accordion_item et_pb_accordion_item_11 et_pb_toggle_close">
<h5 class="et_pb_toggle_title">What are your Screen Print Artwork Guidelines?</h5>
<div class="et_pb_toggle_content clearfix"></div>
</div>
<div class="et_pb_toggle et_pb_module et_pb_accordion_item et_pb_accordion_item_12 et_pb_toggle_open">
<h5 class="et_pb_toggle_title">I don't have access to vector artwork,what do I do?</h5>
<div class="et_pb_toggle_content clearfix"></div>
</div>
</div>
使用 CSS 类:
et_pb_toggle_close - 手风琴项目目前已关闭
et_pb_toggle_open - 手风琴项目当前打开
et_pb_toggle_title - 手风琴项目的标题
点击 et_pb_toggle_title 类即可从关闭变为打开。
这是我当前的 JQuery 代码:
<script>
jQuery(function($){
$('.et_pb_toggle_title').click(function() {
$this = $(this);
$('et_pb_toggle_title').parent().nextAll().not($this).addClass('et_pb_toggle_close').removeClass('et_pb_toggle_open');
$('et_pb_toggle_title').parent().prevAll().not($this.parent()).addClass('et_pb_toggle_close').removeClass('et_pb_toggle_open');
});
});
</script>
代码的逻辑是点击手风琴的标题:
- 获取其后所有手风琴项目的父项。只要它不是当前的手风琴项目,它就会添加关闭的手风琴类并删除打开的手风琴类。
- 获取之前所有手风琴项目的父项。就像在其中一样,只要它不是当前的手风琴项目,它就会添加/删除类。
我不确定这个脚本哪里出了问题,如果能帮助我指出正确的方向,或者指出脚本中/中的错误,我们将不胜感激。
解决方法
这可能会有所帮助:
$('.et_pb_accordion_item').each(function(){
$(this).addClass('et_pb_toggle_close').removeClass('et_pb_toggle_open')
})
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。