jquery - 计算文件夹中的图像并显示具有唯一 ID 的 div

Question

我是 jQuery 新手，正在为自己开发一个测试项目。

我想计算特定文件夹中的所有图像。对于找到的每个图像，我想显示一个具有唯一 ID 和图像的 div。我想在没有 PHP 的情况下在 jQuery 中完成这一切。

图片编号在1到100之间

http://jsfiddle.net/bojba43s/1/

现在我有:

$.ajax({
url:'http://example.com/images/'+i+'.JPG',
type:'HEAD',
error: function()
{ 
  alert('EMPTY FOLDER');
},
success: function()
{
    count++;
    $('#TARGET').append('<div id="img_div_' + i + '"><img src=" http://example.com/images/' + i + '.JPG"><div>');
}

});

这会计算图像的数量。但是我如何才能像这样显示 div？

<div id="insert unique id"><img src="insert image"><div>

Answer 1

您可以在 ajax 成功 block 中使用 jQuery 附加它们:

$.ajax({
    url:'http://example.com/images/'+i+'.jpg',
    type:'HEAD',
    error: function()
    { 
      alert('EMPTY FOLDER');
    },
    success: function()
    {
        count++;
        $('#target').append('<div id="img_div_' + i + '"><img src=" http://example.com/images/' + i + '.jpg"><div>');
    }
});

然后在您的 html 中添加一个“目标”元素:

<div id="target"></div>

或者，在您的 ajax 调用之前以类似的方式附加它!