首页 > 解决方案 > 有什么办法可以让代码更短

问题描述

我已经在我的网站中实现了一个 JavaScript 代码,代码运行以切换幻灯片,并且有 15 个这样的幻灯片,所以对于每个我都实现了幻灯片切换代码,但我想知道有没有更短的方法可以让我写代码一次,它会在所有幻灯片上实现。

    $(".main1").click(function(){
    $(".show1").slideToggle("slow");
  });
    $(".main2").click(function(){
    $(".show2").slideToggle("slow");
  });
    $(".main3").click(function(){
    $(".show3").slideToggle("slow");
  });
    $(".main4").click(function(){
    $(".show4").slideToggle("slow");
  });
    $(".main5").click(function(){
    $(".show5").slideToggle("slow");
  });
    $(".main6").click(function(){
    $(".show6").slideToggle("slow");
  });
    $(".main7").click(function(){
    $(".show7").slideToggle("slow");
  });
    $(".main8").click(function(){
    $(".show8").slideToggle("slow");
  });
    $(".main9").click(function(){
    $(".show9").slideToggle("slow");
  });
    $(".main10").click(function(){
    $(".show10").slideToggle("slow");
});
    $(".main11").click(function(){
    $(".show11").slideToggle("slow");
  });
    $(".main12").click(function(){
    $(".show12").slideToggle("slow");
  });
    $(".main13").click(function(){
    $(".show13").slideToggle("slow");
  });
    $(".main14").click(function(){
    $(".show14").slideToggle("slow");
  });
    $(".main15").click(function(){
    $(".show15").slideToggle("slow");
  });

标签: javascripthtmljqueryjquery-events

解决方案


我相信这对你有用。

for (let i = 1; i <= 15; i++) {
  $(".main" + i).click(function(){
    $(".show" + i).slideToggle("slow");
  });
} 

推荐阅读