时间戳

首页 > 解决方案 > 一页上的三个 Javascript 手风琴两个工作

javascript - 一页上的三个 Javascript 手风琴两个工作

问题描述

嗨试图在一页上有多个手风琴。三六个之类的。但是第二个或第四个等不起作用。有人有想法吗？

链接：https ://www.w3schools.com/code/tryit.asp?filename=GBYOZDRRVKFA

标签： javascriptaccordion

解决方案

问题是您将相同的脚本复制了 3 次。只保留最后一个并删除其他脚本块。

编辑： 此 javascript 不适用于动态生成的 html。
我已经用 jQuery 更新了代码。关注https://www.w3schools.com/code/tryit.asp?filename=GC1V1TGM6QHJ<script>内的标签<head>

只需 4 行脚本，奇迹就发生了

$(document).ready(function(){  
//$(".accordion").click(function(){  
  $(document).on("click", ".accordion" , function() {
    $(this).toggleClass("active");    
    $(this).next(".panel").toggle();
  });
});

我建议，一旦你对 JavaScript 有信心，就开始一起学习 jQuery。它非常容易学习并且功能强大。你可以用更少的代码做很多事情。

这是带有交互式示例的分步 jQuery 教程。
这是一个视频教程

推荐阅读