Javascript 保持变量'；用于两个函数时的s值常量

我正在从事的项目是一个单页网站：

http://50.87.144.37/~projtest/team/design/yellowmedia/

有两件事，首先是左右箭头，然后是这些箭头右侧的导航（如果不清楚，请访问链接）。右箭头和左箭头由.click（）控制，导航由函数navClick（）控制。变量“currentPage”是控制/收集用户所在页面的变量。现在，这两个函数各自都可以正常工作，但假设您单击任何导航图标，currentPage变量保持为零，我要做的是传递其值，以便右/左箭头获得值，以便这两个功能可以一起工作。如果用户单击第三个导航图标，则当前页面应变为2，依此类推

你可以通过点击最后一个导航图标来测试这个“错误”，它将显示地图的图像，然后点击右箭头图标6次，这将使它失效。发生的情况是，当您单击时，currentPage从0增加到6，而当单击第6个导航图标时，它应该是6

在第1页：第2页：currentPage=0
在第3页：currentPage=2
在第4页：currentPage=3
在第5页：currentPage=4
在第6页：currentPage=5

var currentPage = 0;

$(document).ready( function() {

navclick();

$('.rightArrow').stop().click(function () {
currentPage++;

if(currentPage > $(".section").length - 1){
   currentPage = $(".section").length - 1;
}

$('.section').eq(currentPage-1).animate({
    left: '-100%'
}, 200);
$('.section').eq(currentPage).animate({
    left: '0%'
}, 200);
$('.section').eq(currentPage-1).animate({
    left: '-100%'
}, 200);}

});

$('.leftArrow').click(function () { 

currentPage--;

if(currentPage < 0){
   currentPage = 0;
   $('.leftArrow').removeClass('leftArrow').addClass('leftDeactive');
}


$('.section').eq(currentPage+1).animate({
    left: '-100%'
},  200);
$('.section').eq(currentPage).animate({
    left: '0%'
},  200);

$('.section').eq(currentPage+1).animate({
    left: '-100%'
},  200);

});

}

function navclick(){

var a=2;
$('.clickNav').click(function(){
var targetId = $(this).attr('href');

$(targetId).animate({
    left: '0%'
},  500);

$(targetId).siblings('.section').animate({
    left: '-100%'
},  500);

$(targetId).css('z-index',a);
a = a+1;



if(currentPage>5){
    currentPage=5;
    } else if(targetId =="#section-5"){
    currentPage = 6;
    }
});
}

var currentPage=0；
$（文档）.ready（函数（）{
navclick（）；
$（'.rightArrow'）。停止（）。单击（函数（）{
currentPage++；
如果（当前页面>$（“.section”）.length-1）{
currentPage=$（“.section”）。长度-1；
}
$（'.section'）.eq（当前第1页）.动画({
左：“-100%”
}, 200);
$（'.section'）.eq（当前页）.动画({
左：“0%”
}, 200);
$（'.section'）.eq（当前第1页）.动画({
左：“-100%”
}, 200);}
});
$（'.leftArrow'）。单击（函数（）{
当前页--；
如果（当前页面<0）{
currentPage=0；
$（'.leftArrow'）.removeClass（'leftArrow'）.addClass（'leftDeactive'）；
}
$（'.section'）.eq（当前页+1）.动画({
左：“-100%”
},  200);
$（'.section'）.eq（当前页）.动画({
左：“0%”
},  200);
$（'.section'）.eq（当前页+1）.动画({
左：“-100%”
},  200);
});
}
函数navclick（）{
var a=2；
$（'.clickNav'）。单击（函数（）{
var targetId=$（this.attr（'href'）；
$（targetId）。设置动画({
左：“0%”
},  500);
$（targetId）.同级（'.section'）。动画({
左：“-100%”
},  500);
$（targetId）.css（'z-index'，a）；
a=a+1；
如果（当前页面>5）{
当前页面=5；
}否则如果（targetId==“#第5节”）{
当前页面=6；
}
});
}

每次单击导航按钮时尝试更新变量：

function navclick(){

var a=2;
$('.clickNav').click(function(){
var targetId = $(this).attr('href');
currentPage = targetId.substring(9);   //Get your new page without string "section-"

$(targetId).animate({
    left: '0%'
},  500);

你也可以试试这样的。 我认为它更简单、更优化（即使它应该一直更优化）：

---

我没有任何箭头。中间有一个徽标和底部的一些社交网站。仅此而已。请检查一下，如果可能的话，你能告诉我你的决心吗？