Question

我编写了这段代码，该代码根据本地目录中文本文件的数量来创建div。

然后，我尝试编写其他代码，该代码将照片附加到每个div中。不幸的是，该代码没有附加任何照片...

function liGenerator() {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState == XMLHttpRequest.DONE) {
        if (xmlhttp.status == 200) {
          var n = (xmlhttp.responseText.match(/txt/g) || []).length;
          for (var i = 1; i < n; i++) {
            $.get("projects/txt/"+i+".txt", function(data) {
              var line = data.split('\n');
              var num = line[0]-"\n";
              var clss = line[1];
              var title = line[2];
              var price = line[3];
              var content = line[4];
              $("#list-portfolio").append("<li class='item "+clss+" show' onclick='productSelection(&#39;"+num+"&#39;)'><img src='projects/src/"+num+"/title.jpg'/><div class='title'><h1>"+title+"</h1><h2>"+price+"</h2></div><article>"+content+"</article></li>");
              $("#full-size-articles").append("<li class='product "+num+"'><div><div class='photo_gallery'><div id='fsa_img "+num+"'><div width='100%' class='firstgalleryitem'></div></div></div><article class='content'><h1 class='header_article'>"+title+"</h1><h2 class='price_article'>"+price+"</h2><section class='section_article'>"+content+"</section></article></div></li>");
          });
        }
      }
    }
  };
  xmlhttp.open("GET", "projects/txt/", true);
  xmlhttp.send();
}   

function pushPhotos() {
  var list = document.getElementById("full-size-articles").getElementsByTagName("li");
  var amount = list.length;
  for(var i=1;i<=amount;i++) {
    var divID = "#fsa_img "+i;
    var where = "projects/src/"+i+"/";
    var fx = ".jpg";
    loadPhotos(where, fx, divID);
  }
}

function loadPhotos(dir, fileextension, div) {
  $.ajax({
    url: dir,
    success: function (data) {
      $(data).find("a:contains(" + fileextension + ")").each(function () {
        var filename = this.href.replace(window.location, "").replace("http://", "");
        $(div).append("<img src='"+dir+filename+"' class='mini_photo'/>");
      });
    }
  });
}

关于为什么此代码无法按预期运行的任何想法？

Answer 1

主要问题是“ #fsa_img”和“ i”之间的空格。当我将其更改为““ #fsa_img _” + i“时，代码按预期开始工作。

如何将照片动态加载到动态加载的div？

1 个答案: