Javascript 变量不起作用。为什么？答案

【问题标题】：Javascript variable not working. Why?Javascript 变量不起作用。为什么？
【发布时间】：2011-05-12 07:02:26
【问题描述】：

我不了解 javascript 中的变量。我试图在 localScroll 函数发生之前更改/计算“偏移量”（使用变量“theOffset”），或者在调整窗口大小时更合适。以下实例均无效，请接受“//initialize offset”。

如何让“$.localScroll”中的变量“theOffset”改变？

jQuery(function( $ ){

    //initialize offset
    var windowWidth = $(window).width();
    if (windowWidth < 900) {
        theOffset = 0;
    } else {
        theOffset = ($(window).width() - 900) / -2;
    }

$(window).resize(function() {
    //calculate offset
    var windowWidth = $(window).width();
    if (windowWidth < 900) {
        theOffset = 0;
    } else {
        theOffset = ($(window).width() - 900) / -2;
    }
});


    $.localScroll({
        target: '#content',
        queue:true,
        duration:1500,
        hash:true,
        stop:true,
        onBefore:function( e, anchor, $target ){
            //calculate offset
            var windowWidth = $(window).width();
            if (windowWidth < 900) {
                theOffset = 0;
            } else {
                theOffset = ($(window).width() - 900) / -2;
            }
        },
        offset: {top:0, left: theOffset,
        onAfter:function( anchor, settings ){
            if (windowWidth < 900) {
                theOffset = 0;
            } else {
                theOffset = ($(window).width() - 900) / -2;
            }
        }   
    });
});

如果需要知道，我将一个 div 容器居中到带有偏移量的窗口中，位于一个花哨的侧滚动网站中；）

【问题讨论】：

jslint.com 出现 3 个错误
即使没有错误，同样的问题仍然存在......{top:0, left:theOffset} 在执行时被评估，因此变量范围的闭包不会修复行为并使其动态而不知道/[ab]使用滚动到 API/internals 或重新调用 localScroll 函数。

标签： javascript jquery variables scope

【解决方案1】：

在jquery函数外声明offset


var theOffset = 0;

jquery( function ( $ ) {
} )

【讨论】：

你能解释一下为什么我能理解吗？
@Dave 通过这样做“theOffset”将获得全局范围，并且在一个地方更改它应该在所有其他地方“可见”。
问题是theOffset的值被传递了。
如果 localScroll 函数在我的 init.js 文件（包含上面的代码）之前被加载，我需要在 localScroll 加载之前声明变量，还是在“jQuery(function($) {});"它在 init.js 中（在 localScroll 插件之后加载）。

【解决方案2】：

我认为你的问题在这里：

offset: {top:0, left: theOffset,

首先，您缺少一个尾随 }。

其次，您正在执行所谓的“按值传递” - 当您调用 $.localscroll() 时发送的值实际上是偏移量中指定的值的副本。

您使用的是哪个版本的 localScroll？我下载了我能找到的最新源，它是 1.2.7，但我在任何地方都没有看到任何关于 offset 的信息。

如果不查看 localScroll 源，我无法立即解决您的问题。有时，像这样的 jQuery 插件的作者提供了一种更新选项的方法。如果不是这样，您可能必须修改 localScroll 源以通过函数回调而不是通过对象属性来获取偏移值：

offset: {top:0, left: function() { return theOffset; } }

请注意，如果不修改 localScroll 源以通过函数调用而不是 options 属性获取此数据，上述方法将不起作用。

【讨论】：

【解决方案3】：

您可以声明一个 myOffset 对象，该对象将通过引用传递给 offset: 您还可以将几乎四倍的函数细化为单个命名函数：

var myOffset = {top: 0, left: theOffset};
function calcOffset() {
  var windowWidth = $(window).width();
  if (windowWidth < 900) {
    myOffset.left = 0;
  } else {
    myOffset.left = (windowWidth - 900) / -2;
  }
}
calcOffset();
// note leaving off the () will pass the function as a parameter instead of calling it
$(window).resize(calcOffset);

$.localScroll({
    target: '#content',
    queue: true,
    duration: 1500,
    hash: true,
    stop: true,
    onBefore: calcOffset,
    offset: myOffset,
    onAfter: calcOffset
});

【讨论】：

【解决方案4】：

请注意，在上面的示例中，如果您再次调用setupSomeGlobals()，则会创建一个新的闭包（堆栈帧！）。旧的gLogNumber、gIncreaseNumber、gSetNumber 变量被具有新闭包的新函数覆盖。（在 JavaScript 中，每当您在另一个函数中声明一个函数时，每次调用外部函数时都会重新创建内部函数。）

【讨论】：