Прочтите JSON, чтобы добавить изображения

Question

Я делаю слайдер потока изображения. Он работает нормально, если я жестко кодирую. Теперь я использую JSON-файл, чтобы указать, как загружать изображения из галереи. Изображения загружаются успешно, но мой внешний файл CSS и jquery загружаются неправильно.

Любая помощь будет оценена по достоинству.

<script> 
     $(function(){ 
      var image= [{ 
    "src": "images/starting.jpg", 
      "data-artist":"Gorillaz", 
     "data-album":"Plastic Beach" 
      },]; 

     $.each(image, function(){ 
     $('<img src="' + this.src+ '" />').appendTo('#coverflow'); 
     }); 
    }); 

если я сочинительство это,

<div class="wrapper"> 
     <div id="coverflow"> 
      <img src="img/gorillaz-plasticbeach.jpg" data-artist="Gorillaz" data-album="Plastic Beach"/>--> 
      <!--<img src="images/thumb1.jpg" data-artist="Kings Of Leon" data-album="Come Around Sunshine"/> 
      <img src="images/thumb2.jpg" data-artist="Kid Rock" data-album="Born Free"/>   
      <img src="images/thumb3.jpg" data-artist="Eminem" data-album="Recovery"/> 
      <img src="images/thumb4.jpg" data-artist="Lil Wayne" data-album="I Am Not A Human Being"/> 
      <img src="images/thumb5.jpg" data-artist="Taylor Swift" data-album="Speak Now"/> 
      <img src="images/thumb6.jpg" data-artist="The Band Perry" data-album="The Band Perry"/> 
      <img src="images/thumb7.jpg" data-artist="Maroon 5" data-album="Hands All Over"/> 
      <img src="images/thumb8.jpg" data-artist="My Chemical Romance" data-album="Danger Days"/> 
      <img src="images/thumb9.jpg" data-artist="Iron Maiden" data-album="The Final Frontier"/> 
      <img src="images/thumb10.jpg" data-artist="Order Of The Black" data-album="Black Label Society"/> 
      <img src="images/thumb11.jpg" data-artist="Usher" data-album="Raymond V Raymond"/>--> 
     </div> 
    </div> 

то его прекрасно работает.

я попробовал

$.each(image, function(){ 
$('<img src="' + this.src+ '" />').appendTo('#coverflow');   `$('#coverflow').appendTo('#wrapper'); 
$('#wrapper').appendTo('#demo'); 
$('#demo').appendTo('#pageWrapper'); }); 
alert ('I am all Done'); 
alert('Elements are ' +$('#coverflow').length); }); 

здесь я добавлять изображения в Div 1 по одному. но в конце, когда я проверяю div #coverflow в конце, он содержит только 1 элемент. хотя цикл итерация 11 раз

Answer 1

1. Убедитесь, что изображение (от «каждый») является объектом, который имеет атрибут Src (я знаю, что ты сказал, что это работает жёстко, просто убедитесь, что это объект, использование console.log (тип изображения), прежде чем вы сделаете каждый)
2. .appendTo ('# coverflow'); неверно, вы, вероятно, имеете в виду .appendTo ($ ('# coverflow')); вы можете только добавить материал к объектам Jquery (appendTo работает только на объекты JQuery)

3. начать с простой:

   $ .each (изображение, функция() { console.log (image.src); });