Question

我正在处理的项目是单页网站：

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

有两件事，第一，左箭头和右箭头，然后是这些箭头右侧的导航（如果不清楚，请访问链接）。右箭头和左箭头由.click（）控制，导航由navClick（）函数控制。变量'currentPage'是控制/收集用户所在页面的变量。现在，这两个函数都可以单独工作，但是假设你单击任何导航图标，currentPage变量保持为零，我想要做的是传递它的值，使右/左箭头得到值，这样这两个功能可以一起工作。如果用户点击假设，第3个导航图标，则currentPage应为2，依此类推。

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

第1页：currentPage = 0
第2页：currentPage = 1
第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;
    }
});
}

Answer 1

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

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);

您也可以尝试这样的事情。我认为它更简单和优化（即使它应该更加优化）： http://jsfiddle.net/3TxjF/3/

在两个函数中使用时，保持变量的值不变

1 个答案: