变量不会在 jQuery 函数中递增？答案

【问题标题】：Variables won't increment in a jQuery function?变量不会在 jQuery 函数中递增？
【发布时间】：2013-05-31 15:22:21
【问题描述】：

当我遇到代码问题时，我正在做最后一分钟的修改：



$(document).ready(function() 
{
/* Declaring some variables to help with scrolling through my Portfolio */
var workArray = [];
var scrollPos = 1;

/* This makes the left scroll arrow disappear if it's 
at the start (scrollPos is less then or equal to 1) */
if (scrollPos <= 1) {
    $('#left_scroll').hide();
} else {
    $('#left_scroll').show();
}

/*This SHOULD decrement and increment values to the scrollPos variable
when the corresponding arrows are clicked*/ 
$('#left_scroll').click(function(){
    scrollPos--;
});
$('#right_scroll').click(function(){
    scrollPos++;
});

(left_scroll) 被分配给我页面上的一个箭头键，该箭头键假设从值 (scrollPos) 中减去，该值告诉何时应该看到左箭头或右箭头图像。

目前我将值 scrollPos 设置为 1，所以左箭头键是不可见的，而右箭头键是可见的，但由于某种原因，当任何一个被单击时，它似乎没有任何值被更改为左箭头键仍然不可见。

任何人都可以看到我的代码有任何问题，希望您能提供帮助。 :D

马丁

【问题讨论】：

我目前看到的唯一问题是文档就绪功能块缺少右括号。但是当您粘贴代码时，这可能会丢失......您的 HTML 代码看起来如何？您的按钮是否会触发（例如使用alert 测试）？任何 jsFiddle 链接？
哦不，我只贴了一小部分JS代码，只是我没有发布而已。

标签： javascript jquery function variables increment

【解决方案1】：

点击处理程序只是按照您告诉他们的去做，即递增和递减。你没有告诉处理程序做任何其他事情，比如hide 和show。

将 hide 和 show 的逻辑放在处理函数中，以便在单击按钮时隐藏和显示。

【讨论】：

我不太清楚你的意思？我对 jQuery 还是很陌生

【解决方案2】：

Working jsFiddle Demo

您必须在递增/递减后调用 if 语句。为此制作一个函数：

function checkScrollPos() {
    /* This makes the left scroll arrow disappear if it's 
    at the start (scrollPos is less then or equal to 1) */
    if (scrollPos <= 1) {
        $('#left_scroll').hide();
    } else {
        $('#left_scroll').show();
    }
}

在你的click之后，调用它：

$('#left_scroll').click(function(){
    scrollPos--;
    checkScrollPos();
});
$('#right_scroll').click(function(){
    scrollPos++;
    checkScrollPos();
});

【讨论】：

啊太棒了，完全忘记了功能，非常感谢队友！

【解决方案3】：

你的代码：

if (scrollPos <= 1) {
    $('#left_scroll').hide();
} else {
    $('#left_scroll').show();
}

只执行一次。如果您想在每次单击箭头时检查 scrollPos 值，请使用函数：

function hideOrShow(scrollPos) {    
    if (scrollPos <= 1) {
        $('#left_scroll').hide();
    } else {
        $('#left_scroll').show();
    }
}

$('#left_scroll').click(function(){
    scrollPos--;
    hideOrShow(scrollPos)
});
$('#right_scroll').click(function(){
    scrollPos++;
    hideOrShow(scrollPos)
});

【讨论】：