Ajax從PHP加載更多

Question

更新：

我想加載更多ajax按鈕，我希望它從php文件加載數據，該文件將從數據庫中提取數據。

我設法使其僅加載一次，但是當我單擊新的更多按鈕時，它不起作用。

這是Javascript：

$(document).ready(function(){
    $(".more").click(function(){
        var ID = $(this).attr("id");
        if(ID) {
            $("#more"+ID).html('<img src="moreajax.gif" />');

            $.ajax({
                type: "POST",
                url: "more.php",
                data: "lastimg="+ ID,
                cache: false,
                success: function(html){
                    $("div#updates").append(html);
                    $("#more"+ID).remove(); // removing old more button
                }
            });
        } else {
            $(".morebox").html('The End');// no results
        }

        return false;
    });
});

這是more.php

$lastimg = mysql_real_escape_string($_POST['lastimg']);

$result = $mmhclass->db->query("SELECT * FROM `file_storage` WHERE `is_private` = '0' AND `file_id` < '$lastimg' ORDER BY `file_id` DESC LIMIT 10;", array(MYSQL_FILE_STORAGE_TABLE));

while($row=mysql_fetch_array($result))
{
$file_id = $row['file_id'];
$filename = $row['filename'];
?>
    <li>
        <?php echo $filename; ?>
    </li>
<?php
}
?>
<div id="more<?php echo $file_id; ?>" class="morebox">
    <a href="#" class="more" id="<?php echo $file_id; ?>">more</a>
</div>

Answer 1

它只工作一次，因為在您的Ajax完成之后， .more元素將在頁面上變為新的，因此您附加到其上的click事件處理程序將不再起作用。

您必須使用事件委托：

$('body').on('click', '.more', function () {
    // your code
});

• 注意：需要jQuery 1.7+ 。

---

參考文獻：

• .on() -jQuery API文檔

Answer 2

我認為您可以使用jQuery live函數

$(".more").live("click", function(){ 

// Code here
});

Answer 3

請嘗試。希望此代碼對您有所幫助

$(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);
        }
    }); 
});

}）;

本教程為您提供競爭幫助http://webexpert-anilshah.com/create-load-data-blog-using-jquery-ajax-php-database/