JavaScript(JQuery）全局变量不工作

JavaScript (JQuery) Global Var not working?

本文关键字：工作 全局变量 JQuery JavaScript      更新时间：2023-09-26

为什么这不起作用？我想，如果我在计算"prw"answers"prh"变量的函数之外，但在作用域函数内设置它们，它会起作用。但事实并非如此！我做错了什么？

    $(document).ready(function() {
            var wrap = document.getElementById('imdiv');
            var img = wrap.getElementsByTagName('img')[0];
            var prw;
            var prh;
            $("<img/>")
                .attr("src", $(img)
                .attr("src"))
                .load(function() {
                    prw = this.width;
                    prh = this.height;
            });
            console.log('prw ~ ', prw);
            console.log('prh ~ ', prh);
    });

问题与全局变量无关。唯一的问题是，在为变量设置值之前，必须打印变量的值。一旦图像加载到dom，Load函数就会得到调用。

这首先执行。仍然没有定义的值

console.log('prw ~ ', prw);
console.log('prh ~ ', prh);

之后将执行此操作。

prw = this.width;
prh = this.height;

如果你想看到正确的值，你应该在设置后立即打印值

$("<img/>")
    .attr("src", $(img)
    .attr("src"))
      .load(function() {
            prw = this.width;
            prh = this.height;
            console.log('prw ~ ', prw);
            console.log('prh ~ ', prh);
       });

这样做：

var prw;
var prh;
$(document).ready(function() {
var wrap = document.getElementById('imdiv');
var img = wrap.getElementsByTagName('img')[0];
$("<img/>")
.attr("src", $(img)
.attr("src"))
.load(function() {
    prw = this.width;
    prh = this.height;
    return doStuff()
})
});
function doStuff(){
    console.log('prw ~ ', prw);
    console.log('prh ~ ', prh);
}

您在内部再次声明prw和prh$（文档）就绪因此，在该块中，您将创建两个与全局变量名称相同的局部变量，因此，由于JavaScript范围规则，您将访问局部变量，而不是全局变量。

考虑下一个例子：

var x = 3;
function f()
{
  var x;
  x = 2;
  alert(x);
}
f();
alert(x);

输出为2和3。

相关文章：