2

我正在尝试创建一组图像对象，但很挣扎。每个对象将包含一个图像和图像的标题。

当我将以下代码粘贴到 Firebug 中进行检查时，它可以正常工作：

示例 1

var imageArray = new Array();

imageArray[0] = new Image();
console.log(imageArray[0]);  //result is <img>

imageArray[0].src = "my-image-01.png";
console.log(imageArray[0]); // result is <img src="my-image-01.png"/>

imageArray[0] = {imageCaption: "A caption for the image"};  //an object
console.log(imageArray[0].imageCaption) //result is: A caption for the image

imageArray[1] = new Image()

... ETC

但是，我认为以下内容会更有意义，但它不断抛出错误，我不明白为什么。

示例 2

var imageArray = new Array();

imageArray[0]= {
    image01: new Image(),
    image01.src: "my-image-01.png",  //"SyntaxError: missing : after property id"
    imageCaption: "An image caption"
    };

imageArray[1] = {
    image02: new Image().
    image02.src: "my-image-02.png",
    imageCaption: "Another image caption"
    }

谁能解释上面的代码有什么问题？我发布的第一个示例是我应该使用的方法吗？非常感谢

4

5 回答 5

6

你最好的选择是使用一种工厂和.push图像数组。

尝试这样的事情

// Image factory
var createImage = function(src, title) {
  var img   = new Image();
  img.src   = src;
  img.alt   = title;
  img.title = title;
  return img; 
};

// array of images
var images = [];

// push two images to the array
images.push(createImage("foo.jpg", "foo title"));
images.push(createImage("bar.jpg", "bar title"));

// output
console.log(images);

输出

[
  <img src=​"foo.jpg" title=​"foo title" alt="foo title">​, 
  <img src=​"bar.jpg" title=​"bar title" alt="bar title">​
]
于 2013-10-13T23:30:17.863 回答
1

在您的第一个示例中，您有

var imageArray = new Array();
imageArray[0] = new Image(); // an image object
imageArray[0].src = "my-image-01.png"; // src set in image object

// Here you are completely destroying the image object and creating a new object
imageArray[0] = { imageCaption: "A caption for the image" };  //an object
console.log(imageArray[0]); // Object {imageCaption: "A caption for the image"}

在你的第二个例子中，你有

imageArray[0]= {
    image01: new Image(),
    image01.src: "my-image-01.png",  // <-- this is wrong
    imageCaption: "An image caption"
};

这里image01只是一个键/字符串，而不是一个object，并且image01.src由于其中而出错.，键名可以包含_和空格（如果引用，则为 ir 'key one'）。所以，你可以这样使用它，但我认为你可以删除image01 : new Image()并且可以在使用这个对象时创建新图像，就像这个 fiddle 一样。

var imageArray = [];
imageArray[0] = {
    image01 : new Image(),
    src : "my-image-01.png",
    imageCaption : "Image caption for image-01"
};
imageArray[1] = {
    image01 : new Image(),
    src : "my-image-02.png",
    imageCaption : "Image caption for image-02"
};

for(x = 0; x < imageArray.length; x++) {
    console.log(imageArray[x].src);
}

因此，console.log(imageArray[0].src);将输出my-image-01.png. 如果您想caption在图像对象本身中使用 a 则图像对象没有caption属性，您可以使用data-caption或alt稍后以某种方式使用，但使用HTML5您可以使用这样的标题

<figure>
    <img src="picture.jpg" alt="An awesome picture">
    <figcaption>Caption for the awesome picture</figcaption>
</figure>

这里有一个例子。此外，作为替代方案，您可以通过示例查看此答案。

于 2013-10-14T00:00:27.767 回答
0

回到第一个。更改第三行

imageArray[0] = new Image();
imageArray[0].src = "my-image-01.png";
imageArray[0].imageCaption = "A caption for the image";
于 2013-10-13T23:20:28.330 回答
0

两个问题：

  • 有个 。而不是 a , at image02 in imageArray[1]
  • 您不能使用 a.作为对象的属性名称

所以代码应该是这样的：

imageArray[0]= {
    image: new Image(),
    src: "my-image-01.png",  //"SyntaxError: missing : after property id"
    caption: "An image caption"
};

imageArray[1] = {
    image: new Image().
    src: "my-image-02.png",
    caption: "Another image caption"
}
于 2013-10-13T23:20:37.803 回答
-1

第一： System.Array 类是抽象的，你不能把它分开。[您可以使用集合中的 ArrayList]

第二：要在对象初始化中分配值，您必须使用“=”而不是“:”，后跟“”，如下所示：new Image { src = "my-image-01.png", imageCaption = "An image caption" }

你的代码：

var imageList = new ArrayList();

        imageList.Add(new Image { src = "my-image-01.png", imageCaption = "An image caption" });
        imageList.Add(new Image { src = "my-image-02.png", imageCaption = "Another image caption" });
于 2013-10-13T23:45:02.460 回答