Img src在页面加载时更改

Question

我希望JavaScript在页面加载时加载一些img src。但是我的解决方案似乎不起作用。 任何帮助将非常感激。

HTML

<li><img id="option1" height="45px" width="75px" alt="" src=""></li>
<li><img id="option2" height="45px" width="75px" alt="" src=""></li>

的JavaScript

function filltopfoto(){
    var settoppic = new Image;
    for (var i = 0; i <= itemlist;i++){
        settoppic.src = 'img' + i + '.jpg';
        $('option' + i).src = settoppic.src;
    }
}

仅供参考：
itemlist包含需要填充的图像数量。 脚本在加载时加载。

Answer 1

Here is the jsfiddle下面的代码展示了一个真实的例子。

images = ["image1/url", "image2/url"]              // define image source urls

$(document).ready(function(){                      // wait until the document is ready
    for(var i = 0; i < images.length; i++)         // loop over all images
        $('#option'+(i+1)).attr('src', images[i]); // set the src attribute, note the '#'
});

你的几个错误：

1. JQuery的$('#id')查找需要使用＃标签（＃）。
2. 永远不会调用您的filltopfoto()函数（尝试在函数内部执行alert('hello!')）。
3. 您的$('options'+i)提供options0和options 1 - 您需要options1和options2
4. 不确定为什么要创建new Image只是为了存储src变量。您可以删除此代码。