Javascript Freewall使用json显示标题、图像id

JSON

JS

var-wall=新的自由墙（“自由墙”）；
$（'.add more'）。单击（函数（）{
$.ajax({
url:getDataUrl，
键入：“GET”，
数据类型：“json”，
成功：功能（响应）{
对于（变量i=0；i<20；++i）{
$.each（response.items、函数（索引、值）{
var tmp=''；
tmp+=''；
tmp+=“”；
tmp+=''；
tmp+='
'+value.name+'
'；
}
墙板（tmp）；
wall.refresh（）；
}
墙宽度（）；
},
错误：函数（错误）{
console.log（错误）
}
});
});

使用freewall附加更多带有标题和id的图像。控制台上的错误为

uncaughtsyntaxerror:uncoughtidentifier

。我检查了几次代码，但没有发现任何错误

如果单击按钮，如何使用json从#20开始追加？使用

url？max=10

，模板将仅显示10。然后，它应该检查从

开始，例如从
#11
开始，并在
单击
按钮时显示20个图像（11到31）

---

感谢您的帮助或指导！

有几个错误，您可以如下优化代码

var wall = new freewall("#freewall");

      $('.add-more').click(function(){

          $.ajax({
          url: getDataUrl,
          type: 'GET',
          dataType: 'json',
          success: function( response ){

         for (var i = 0; i < 20; ++i) {
           $.each(response.items, function(index, value) {

           var tmp= '<div class="grid-container">';
            tmp+= '<div class="grid--tile">';
            tmp+= '<a class="overlay" href="portfolio/' + value.id +'"></a>"';
            tmp+= '<img src="'+value.image+'" width="100%" /></div>';
            tmp+= '<p class="title">'+value.name+'</p></div>';

          }
            wall.appendBlock( tmp );
            wall.refresh();
          }
           wall.fitWidth();
         },
          error: function(error) {
            console.log( error)
          }
        });
    });

var-wall=新的自由墙（“自由墙”）；
var-img=0；
$（'.add more'）。单击（函数（）{
$.ajax({
url:getDataUrl，
键入：“GET”，
数据类型：“json”，
成功：功能（响应）{
$.each（response.items、函数（索引、值）{
如果（img
我认为您没有正确关闭**每条语句**，请检查下面的代码。
var wall=新的自由墙（“自由墙”）；
$（'.add more'）。单击（函数（）{
$.ajax({
url:getDataUrl，
键入：“GET”，
数据类型：“json”，
成功：功能（响应）{
对于（变量i=0；i<20；++i）{
$.each（response.items、函数（索引、值）{
var tmp=''；
tmp+=''；
tmp+=“”；
tmp+=''；
tmp+='
'+value.name+'
'；
});
墙板（tmp）；
wall.refresh（）；
}
墙宽度（）；
},
错误：函数（错误）{
console.log（错误）
}
});
});
@charles Stevens-谢谢editThank@pranav ram-但我仍然收到错误-未捕获的语法错误：输入的意外结束我错过了jquery的结束括号。现在我收到错误：未捕获的引用错误：未定义tmp。看起来我需要在$.each（）内移动wall.appendBlock（tmp）是的，我想在第一次加载时显示10个（最多）图像后从json中再获取20个项目。嗯，但单击时附加20个图像（#11-31），然后在第二次单击时仍会附加20个（32-52）图像。下一次单击第三次，它将附加另20个（53-73）。您可以在
$中进行比较。每个
让我们来看看
var wall = new freewall("#freewall");

      $('.add-more').click(function(){

          $.ajax({
          url: getDataUrl,
          type: 'GET',
          dataType: 'json',
          success: function( response ){

         for (var i = 0; i < 20; ++i) {
           $.each(response.items, function(index, value) {

           var tmp= '<div class="grid-container">';
            tmp+= '<div class="grid--tile">';
            tmp+= '<a class="overlay" href="portfolio/' + value.id +'"></a>"';
            tmp+= '<img src="'+value.image+'" width="100%" /></div>';
            tmp+= '<p class="title">'+value.name+'</p></div>';

          }
            wall.appendBlock( tmp );
            wall.refresh();
          }
           wall.fitWidth();
         },
          error: function(error) {
            console.log( error)
          }
        });
    });

var wall = new freewall("#freewall");

var img=0;

$('.add-more').click(function() {

    $.ajax({
        url: getDataUrl,
        type: 'GET',
        dataType: 'json',
        success: function(response) {
            $.each(response.items, function(index, value) {
                if (img<=index&&index<(img+20)) {
                    var tmp = '<div class="grid-container">';
                    tmp += '<div class="grid--tile">';
                    tmp += '<a class="overlay" href="portfolio/' + value.id + '"></a>"';
                    tmp += '<img src="' + value.image + '" width="100%" /></div>';
                    tmp += '<p class="title">' + value.name + '</p></div>'; 
                    wall.appendBlock(tmp);
                    wall.refresh();
                    i++;
                }
            });
            img+=20;
            wall.fitWidth();
        },
        error: function(error) {
            console.log(error)
        }
    });
});

I think you didn't properly close the **each statement**please go through the below code.

var wall = new freewall("#freewall");

      $('.add-more').click(function(){

          $.ajax({
          url: getDataUrl,
          type: 'GET',
          dataType: 'json',
          success: function( response ){

         for (var i = 0; i < 20; ++i) {
           $.each(response.items, function(index, value) {

           var tmp= '<div class="grid-container">';
            tmp+= '<div class="grid--tile">';
            tmp+= '<a class="overlay" href="portfolio/' + value.id +'"></a>"';
            tmp+= '<img src="'+value.image+'" width="100%" /></div>';
            tmp+= '<p class="title">'+value.name+'</p></div>';

          });
            wall.appendBlock( tmp );
            wall.refresh();
          }
           wall.fitWidth();
         },
          error: function(error) {
            console.log( error)
          }
        });
    });