Как организовать шесть столбцов в строках в соответствии с изображениями?

Question

Я трейд организовать изображения в шести колонках, как, но его повторяющимися изображениями

$(document).ready(function() { 
     alert('Hello'); 
     $.ajax({ 
      type: "POST", 
      contentType: "application/json; charset=utf-8", 
      url: "Default4.aspx/BindDatatable", 
      data: "{}", 
      dataType: "json", 
      success: function (data) { 
       var imgs; 
       for (var i = 0; i < data.d.length; i++) { 
        $("#gvDetails").append("<tr><td><img src=" + data.d[i].ImagePath + " height='60px' width='100px' ></img></td><td><img src=" + data.d[i + 1].ImagePath + " height='60px' width='100px' ></img></td><td><img src=" + data.d[i + 2].ImagePath + " height='60px' width='100px' ></img></td><td><img src=" + data.d[i + 3].ImagePath + " height='60px' width='100px' ></img></td><td><img src=" + data.d[i + 4].ImagePath + " height='60px' width='100px' ></img></td><td><img src=" + data.d[i + 5].ImagePath + " height='60px' width='100px' ></img></td></tr>"); 
       }                 
      }, 
      error: function (result) { 
       alert("Error"); 
      } 
     }); 
    }); 

так, как избежать повторения изображений и расположить его как на изображениях рассчитывать?

Answer 1

ПОПРОБУЙТЕ ЭТО ИЗМЕНЕНИЕ. обратите внимание (я не знаю, каково ваше возвращение данных), это может сработать для вас.

success: function (data) { 
     var el = "<tr>"; 
     for (var i = 0; i < data.d.length; i++) { 
     if (i%6 == 0) { 
      el += "</tr><tr>" 
     } 
     el += "<td><img src=" + data.d[i].ImagePath + " height='60px' width='100px' /></td>"); 
     } 
     el += '</tr>'; 
     $("#gvDetails").append($(el));                
    }