Question

Textarea表单将数据提交给服务器，但不刷新页面时不显示注释

这是脚本：

$("#post_reply").click(function(event) {
    event.preventDefault();   
    if(document.getElementById('_comment').value.trim()==""){
        return false;
    }
    $.post( '../services/leave_comment.php', $("#open_status").serialize(),  
        function( data ) {  
            $('#ajax_loading').hide();
            if(data){
                $.ajax({
                    type: 'POST',
                    url : 'http://localhost/tech1/services/get_more_comments.php',  
                    data: 'last_id='+last_id,
                    success: function(data){
                        $('.view_container').append(data);
                        $('.view_container_parent').load('get_more_comments.php');
                    },
                    complete: function(){
                        console.log('DONE');
                    }                       
                });
            }
        });  
});

这是html的结构，并且必须加载view_container_parent而不刷新

<div class="comments" id="comments">
    <div class="comm_container">
        <div class="insert_container">
             <form class="commentform">
             <textarea>
             </form> 
        </div>
     </div>          
     <div class='view_container_parent'>//whole lot of comments
         <div class='view_container'>//single comment
         </div>
         <div class='view_container'>//single comment
         </div>
         <div class='view_container'>//single comment
         </div>
     </div>
</div>

Answer 1

试试这个：

$("#post_reply").click(function(event) {
    event.preventDefault();   
    if(document.getElementById('_comment').value.trim()==""){
            return false;
    }
    $.post('../services/leave_comment.php', $("#open_status").serialize(),  
        function(data) {  
            $('#ajax_loading').hide();
            if(data){
                $('#ajax_loading').show();
                $.ajax({
                type: 'POST',
                url : 'http://localhost/tech1/services/get_more_comments.php',  
                data: 'last_id='+last_id,
                success: function(data) {
                    $('#ajax_loading').hide();
                    console.log('AJAX SUCCESS');
                    $('.view_container_parent').append(data);
                    console.log('Append data');
                    console.log(data);
                },
                complete: function() {
                    console.log('DONE');
                }                
                });
            }
        } 
    );  
});

你的回答必须是（循环）：

<div class="view_container">
...
</div>

您的HTML只需要：

<div class="view_container_parent">
    <div class="view_container">
        <!-- Another comment before -->
    </div>
    <!-- The ajax will append data from here -->
</div>

您可以使用console.log(data)

测试您的回复数据

发布评论而不使用Ajax刷新页面？

1 个答案: