Javascript和jQuery数组未定义


Javascript and jQuery arrays undefined

我试图设置一个数组，但是当我使用console.log(array_name)时，它会打印计数器(x)的编号，而不是打印图像的路径。
一旦我尝试使用console.log(img[x])来检查变量的内容，它是图像的来源，undefined就会出现。
但由于img也不起作用，我不知道发生了什么。

1
2
3
4
5
6
7
8
9
10
$(window).on('load', function(){
    var x = 0;
    var img = [];
        $(".gallery_img").each(function(img){
            var image = new Image();
            image.src = $(this).attr("src");
            x = x + 1;
            img[x] = image.src;
            console.log(img);
            console.log($(this).attr("src"));

我对jquery和javascript很新，所以我非常感谢一些具体的解释，而不仅仅是解决方案。 我希望我已经足够具体，而不是重复

相关讨论

尝试将数组变量var img = [];重命名为var imgs = [];

因为你在函数中使用了相同的变量：

$(".gallery_img").each(function(img)..

来自@ guest271314的评论。

之所以打印计数而不是路径，是因为.each(index, element)中的第一个参数是元素集合中元素的索引

相关讨论

好吧，当你认为你将声明的数组传递给匿名函数时
实际上你用这段代码定义了新的局部变量img：
.each(function(img){})只能在这个新的匿名函数中看到
因为这个函数是一个应该有输入参数的回调函数，它将由each()函数传递：jQuery.each(array，callback)

现在你做了什么，你已经在函数范围内定义了你的数组img：
$(window).on('load', function(){..});
然后将另一个变量定义为将在此函数范围内使用的输入参数：
$(".gallery_img").each(function(img){..});
我猜你试图将这个变量传递给这个函数，但这是不必要的，因为你已经在更广泛的范围内声明了它，并且这个变量已经在函数范围内可用了。
关于javascript变量范围的真相

当您将此变量定义为回调函数参数时，您将获取新的局部变量img，该变量将匹配的索引作为值，并且您的数组img在此函数中变得不可用。

所以你实际上要做的是：

1
2
3
4
5
6
7
8
9
10
11
12
$(window).on('load', function(){
  var x = 0;
  var img = [];
    $(".gallery_img").each(function(ind, val){
      var image = new Image();
      image.src = $(this).attr("src");
      // Unnecessary, we already have index - ind, unless you use some filtering.
      // So you could get rid of x variable and use ind instead, like img[ind] = image.src
      x = x + 1; //<- x becomes 1
      img[x] = image.src; //<- img[0] is undefined as img[1] is where the index began.
      console.log(img);
      console.log($(this).attr("src"));

另外，我建议你习惯使用jsfiddle来设置你的示例代码，这将帮助你调试你的代码和我们来帮助你的实际样本。

在有机会将图像添加到索引0之前，您正在递增数组。

1
2
3
4
5
6
7
8
9
10
$(window).on('load', function(){
var x = 0;
var img = [];
    $(".gallery_img").each(function(img){
        var image = new Image();
        image.src = $(this).attr("src");
        x = x + 1; //<- x becomes 1
        img[x] = image.src; //<- img[0] is undefined as img[1] is where the index began.
        console.log(img);
        console.log($(this).attr("src"));

尝试将代码更改为此。

1
2
3
4
5
6
7
8
9
 $(window).on('load', function(){
var x = 0;
var img = [];
    $(".gallery_img").each(function(img){
        var image = new Image();
        image.src = $(this).attr("src");
        img[x++] = image.src; //this will increment x after the value x is used.
        console.log(img);
        console.log($(this).attr("src"));