首页 > 解决方案 > 这是在 AJAX 请求后更新页面的正确方法吗?

问题描述

我已经成功地做到了,因此用户可以通过 AJAX 进行评论以避免页面刷新,但是,我不确定在页面上显示新数据库记录的正确方法是什么,所以我选择了这个:

$('.postComment').on('click', function(event){
        event.preventDefault();
        var userId = $("input[name=user_id]").val();
        var imageId = $("input[name=image_id]").val();
        var comment = $("textarea[name=comment]").val();

        $.ajax({
            method: 'POST',
            url: urlComment,
            data: {userId: userId, imageId: imageId, comment: comment, _token: token}
        }).done(function(){
            $("textarea[name=comment]").val("");
            $('.comments').append('<p>'+comment+'</p>');   
        })
    });

完成 AJAX 请求后,我删除了文本字段中写入的内容,并在新段落中附加了已上传到数据库的注释。

标签: phpjquery

解决方案


数据在 done 回调中作为第一个参数可用

.done(function(serverResponseData){ 
   /* do something with response data*/
})

如果它是 html,您可以使用任何 jQuery 插入方法将该 html 放在您想要的任何位置。

如果是 JSON 或 XML,则遍历它并将从中解析的各种值包装在 html 中以插入 DOM


推荐阅读