如何使用JQUERY AJAX和PHP DATABASE在博客中创建更多数据

Question

我需要一个按钮来帮助从数据库加载更多数据。我找到了例子，但是太糟糕了。以下是我到目前为止的情况：

$(document).ready(function(){
    $(document).on('click','.show_more',function(){
        var ID = $(this).attr('id');
        $('.show_more').hide();
        $('.loding').show();
        $.ajax({
            type:'POST',
            url:'ajax_more.php',
            data:'id='+ID,
            success:function(html){
                $('#show_more_main'+ID).remove();
                $('.tutorial_list').append(html);
            }
        }); 
    });
});

Answer 1

您可以按照以下技术加载更多数据，只需替换morebox html。

blog.php的

<div class="tutorial_list">
   <!-- LOAD YOUR PHP BLOG DATA -->
   <div class="loading"><img src="fb-load.gif"/></div>
   <!-- More Button here $ID values is a last post id value. -->
   <div id="show_more<?php echo $ID; ?>" class="morebox">
      <a href="#" class="show_more" id="<?php echo $ID; ?>">more</a>
   </div>
</div>

<script>
  $(document).on('click', '.show_more', function() {
  {
    var ID = $(this).attr("id");
    if (ID) {
        $('.morebox').hide();
        $('.loding').show();
        $.ajax({
            type: "POST",
            url: "ajax_more.php",
            data: "lastpost=" + ID,
            cache: false,
            success: function(html) {
                $('.loading').hide();
                $('.tutorial_list').append(html);
                $("#show_more" + ID).remove(); // removing old more button
            }
        });
    } else {
        $(".morebox").html('The End'); // no results
    }
    return false;
  });
</script>

ajax_more.php

<!-- LOAD YOUR PHP BLOG DATA WITH lastpost ID and remember to add below code for load more -->

<!-- More Button here $ID values is a last post id value. -->
<div id="show_more<?php echo $ID; ?>" class="morebox">
    <a href="#" class="show_more" id="<?php echo $ID; ?>">more</a>
</div>