從AJAX加載頁面中的另一頁面加載div

Question

我正在使用jQuery地址來啟用從其他頁面加載特定內容並更改地址欄中的URL。

我正在一個類似社交網絡的網站上工作，因此我正在通過PHP讀取MySQL數據庫的posts表的ID。 我想利用jQuery和AJAX的可能性來動態讀取所有內容。

我發現，我必須使用live() （事實證明是舊的）， delegate() （在1.7.1中也證實是舊的）或on() （事實證明是最好的可能性）通過jQuery + AJAX使事件在動態加載的內容中起作用）。

我還在某處讀到，我不能使用load()或get()從已經加載的內容中的另一個頁面加載新內容，因為它不會“冒泡”（我什至不知道那意味着什么） ）。

要在AJAX加載頁面中加載新內容，我該怎么做？

這是我嘗試使用的代碼段（包含在加載的頁面中）：

<?php 
    if(exist('`posts`')) {
        $load = mysql_query('SELECT `id` FROM `posts` ORDER BY `id` DESC LIMIT 10');
        while($row = mysql_fetch_object($load)) {
?>
            <script type="text/javascript">
                $('body').on('body', 'load', function() {
                    $.get('getpost.php', { pid: <?= $row->id ?> }, function (data) {
                        $('#posts').html($('#post_<?= $row->id ?>', data).html()).show();
                    });
                    $('#posts').off('load');
                });
            </script>
<?php
        }
    }
    else {
?>
    <div align="center">No posts yet.</div>
<?php
    }
?>

getpost.php是我的文件，從該文件中可以獲取div_$row->id以便它出現在起始頁上。

PLUS（僅供您添加），我希望內容加載時沒有鼠標懸停，單擊或模糊事件。

謝謝。

Answer 1

如果要將特定的事件映射動態地應用於與其選擇器匹配的任何新DOM元素，則要使用“ .live（）”。 或者，您可以將行為附加到加載的每個內容塊上。

獨立於數據庫查找來編寫和開發ajax負載，使事情變得更簡單。 以下代碼段在每個元素加載后觸發另一個ajax調用。

<?php
$id = 'div'.mt_rand();
$counter = isset($_REQUEST['counter']) ? $_REQUEST['counter'] : 0;
$next = $counter + 1;
echo <<<END
<div id="{$id}">{$counter}
<script>
$(function() {
   $.ajax('/url?counter={$next}', function(html) {
       $(html).appendTo($('#{$id}').parent()); // or whatever your favorite method is for adding a sibling
   });
});
</script>
</div>
END;
?>

Answer 2

我是唯一認為這種方法完全錯誤的人嗎？ 您為每個帖子都提出了一個ajax請求，這可能最終導致提出過多的請求，從而大大降低了加載時間。 我看不出您不想直接在PHP while循環內編寫帖子的HTML的任何原因。