Question

我有这个ajax功能。它获取textarea的值，将其设置为变量，然后将其发送到instagram。有用。

我想将文本区域值附加到div以显示发布的评论，而不刷新页面。它基本上是一个临时的可见注释，在重新加载页面时将替换为来自instagram的实际注释。

首先，忽略我想要做的是在所有这些的错误字段中。因为我在本地工作，成功不起作用，它被交换。现在没关系。

我遇到的问题是当我从文本区域追加数据时，它会多次追加。我目前在我的页面上显示来自instagram的4张图片。它会在每张照片上附加文本区域数据4次，而不是将数据发送到isntagram，只需附加虚假评论。

如果我从Instagram中删除2张图片，它会为每张图片附加两次...为什么这样做，以及如何在提交表单时这样做，它会附加图像一次，那个div。

这是我提交评论的功能。

function instaComment(){

    $('.messageTextarea').keydown(function() {
        if (event.keyCode == 13) {
            this.form.submit();
            return false;
         }
    });

    $('.button').live('click', function(){


        var name = $(this).siblings('.messageTextarea').val();
        var dataString = name;

        $.ajax({
        dataType: 'json',
          url: "https://api.instagram.com/v1/media/"+$(this).attr('data-the_id')+"/comments?"+hash,
          type: "POST",
          data: "text="+dataString,
          success: function(data) {
              // finish load
            console.log(data, dataString, 'succ');
          },
            error: function(data) {
                for (i=0; i < instadata[0].data.length; i++){
                    var username = instadata[0].data[i].user.username;
                    var profilepic = instadata[0].data[i].user.profile_picture;

                    console.log(data, dataString, 'succ');
                    $(this).each(function() {
                        $('.messageComments').append('<li><img class="commentUserImg" src="' + profilepic + '"><div class="commentUser">' + username + '</div><div class="commentText">' + dataString + '</div></li>');
                    });


                }
        }
    });
    return false;
});
}

Answer 1

我不确定，但我认为你的问题来自这行代码

  $(this).each(function() {
                        $('.messageComments').append('<li><img class="commentUserImg" src="' + profilepic + '"><div class="commentUser">' + username + '</div><div class="commentText">' + dataString + '</div></li>');
                    });

为什么这会多次追加？ AJAX

1 个答案: