divごとに2jsonオブジェクトを追加する

Question

divごとに2つの異なるJSONアイテムを追加しようとしています。私はjsonをループしてオブジェクトを追加する前にdivを空にします。

しかし、divごとに2つを追加する必要があり、各項目は異なる必要があります。 例DIV1はIMG1 & IMG2を持って、DIV2はIMG3 & IMG4などがあり

これは私が取得しています結果である -

   <div class="gallery-sub-slider"> 

       <div> 
        <img class="img1"> 
        <img class="img2"> 
        <img class="img3"> 
        <img class="img4"> 
        <img class="img5"> 
       </div> 

       <div> 
        <img class="img1"> 
        <img class="img2"> 
        <img class="img3"> 
        <img class="img4"> 
        <img class="img5"> 
       </div> 

      </div> 

しかし、これは私が必要とする結果である -

<div class="gallery-sub-slider"> 

       <div> 
        <img class="img1"> 
        <img class="img2"> 
       </div> 

       <div> 
        <img class="img3"> 
        <img class="img4"> 
       </div> 

       <div> 
        <img class="img5"> 
        <img class="img6"> 
       </div> 

      </div> 

 $.each(data.carImages, function(i){ 
 
     counter++; 
 
     imgLink = data.carImages[i].imgLink; 
 
     console.log(counter); 
 

 
     $('.gallery-slider').append('<div><img src="' + imgLink + '" class="gallery-img" data-tag="' + i + '"></div>'); 
 
     $('.gallery-sub-slider').append('<div class="sub-gallery-item" data-index="' + i + '"></div>'); 
 

 
     $('.gallery-sub-slider div').append('<img src="' + imgLink + '" class="sub-gallery-img" data-tag="1"><img src="' + imgLink + '" class="sub-gallery-img">'); 
 
     
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Answer 1

のではなく、各data.carImageをループ、あなたが最初にあなたが必要となるのdivの数を計算することを検討することができますそれらを通して

var divCount = Math.ceil(data.carImages.length/2) 

とループ：

for (var i = 0; i < divCount; i++) { 
    var firstImgIndex = i*2; 
    var secondImgIndex = firstImgIndex + 1; 

    var firstImg = data.carImages[firstImgIndex]; 
    var secondImg = data.carImages[secondImgIndex]; 

    // create your div now, with your first and second img, but you might have to check that secondImg !== null or undefined 
}