javascript - Jquery onclick 导航上一个按钮

Question

我是 Javascript 新手，尝试在作品集网站上实现下一个/上一个(循环)按钮。我设法使“下一个”按钮正常工作，但找不到使上一个按钮正确工作的方法。我已经尝试了一切，但最终没有解决方案。

所以，在我的 HTML 部分中，我有一些类，我可以根据菜单 + 按钮加载其他文件:

<button class="paginate pt-trigger2"><i>PREVIOUS</button>
<button class="paginate pt-trigger3"><i>NEXT</button> 

<div class="pt-page pt-page-2" id="cadrage"><div class=contiennement> </div></div>
<div class="pt-page pt-page-3" id="cadrage"><div class="contiennement"> </div></div>

在 Jquery 方面，这是我包含的脚本:

<script>

$(document).ready(function(){
var arr = ["home.php","photo.php","websites.php","identity.php","illustration.php","about.php"];

var index = 1;  

var pagess = [".pt-page-1",".pt-page-2",".pt-page-3",".pt-page-4",".pt-page-5",".pt-page-6"];

$('.pt-trigger2').click(function(){ 
 $(".pt-page").html("");
 $('.pt-page').fadeIn(500);
     $(pagess[index]).load(arr[index]); 
    index = (index-1) % arr.length ;
 });

  $('.pt-trigger3').click(function(){ 
 $(".pt-page").html("");
$('.pt-page').fadeIn(500);
    $(pagess[index]).load(arr[index]); 
    index = (index+1) % arr.length ;
 });

});
<script>

所以，一切正常，除了我在网站上的任何位置，上一个按钮加载 .pt-page-2 ( photo.php ) 中的内容

抱歉，我是个新手，我会尽力做到最好。

预先感谢亲爱的网络空间。

Answer 1

我不知道这是否是您正在寻找的解决方案......

有一个插件专门用于执行此操作。 http://jquery.malsup.com/cycle2/

它循环浏览内容并允许您指定导航链接、过渡效果等。