Question

当ajax成功时，如何刷新div的 like-count ？

问题：当我点击dislike时，我需要刷新页面才能看到结果更改。

问题：如何才能立即显示结果？

Answer 1

清空AJAX上的div success

success: function(response){
    $('.your-div-class').empty();
    //then append your result or change the style 
    $('.your-div-class').append('html');   
}

如果您想更改div的样式，可以查看此链接，

http://www.kirupa.com/html5/setting_css_styles_using_javascript.htm

Answer 2

当你没有提供任何代码或详细的例子时，很难准确说出你在寻找什么，但我希望这在某种程度上有所帮助。

您可以使用ajax的成功功能来更改DOM元素的文本值。

示例：

<html>
<body>
<div class="likes">
    <button id="like-button">like</button>
    <button id="dislike-button">dislike</button>

    <span id="like-count">0</span>
    <span id="dislike-count">0</span>
</div>
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script>
    $('#like-button').on('click', function() {
        updateLikes ('like');
    });

    $('#dislike-button').on('click', function() {
        updateLikes ('dislike');
    });

    function updateLikes (type) {
        $.ajax({
            type: 'get',
            async: true,
            url: 'server.php',
            data: {command: type},
            success: function(data) {
                number = parseInt(data);
                var currentLike;
                var span;
                if (type == 'like') {
                    span = $('#like-count');
                    currentLike = parseInt(span.text());    
                } else {
                    span = $('#dislike-count');
                    currentLike = parseInt(span.text()); 
                }
                span.empty();
                currentLike += number;
                span.text(currentLike.toString());
            }
        });
    }
</script>
</body>
</html>

以上所做的是，一旦有人点击喜欢/不喜欢按钮，它就会在您的服务器上运行一个功能，用于更新数据库中的喜欢数量。完成后，服务器将返回一个整数，然后将其添加到当前的喜欢数量。这些都是异步完成的，因此在继续执行脚本的其余部分之前，您不必等待服务器的响应。它还可以更新数字，而无需刷新页面。

Answer 3

success:function(response) {
    $("#divID").html(response);
}

如何刷新ajax成功的div内容

3 个答案: