さて、私は次のコードを持っています:
function() {
$("ul#postbit").load('load.php').fadeIn("slow");
}, 3000);
私が達成しようとしているのは、load.php を読み込んで結果を先頭に追加し、<li>
フェードインさせた後です。現時点では、にあるものを上書きしますul#postbit
。新しい結果をロードして、そこにあったものを保持したいだけです。それが理にかなっていることを願っています。
さて、私は次のコードを持っています:
function() {
$("ul#postbit").load('load.php').fadeIn("slow");
}, 3000);
私が達成しようとしているのは、load.php を読み込んで結果を先頭に追加し、<li>
フェードインさせた後です。現時点では、にあるものを上書きしますul#postbit
。新しい結果をロードして、そこにあったものを保持したいだけです。それが理にかなっていることを願っています。
この.load()
メソッドは、そのように機能するように設計されています。つまり、Ajax レスポンスを呼び出した要素に直接ロードします。代わりに、他のAjax メソッドのいずれかを使用してみてください。
$.get("load.php", function(data) {
$(data).prependTo("#postbit").fadeIn("slow");
});
これは、「load.php」がli要素を含むhtmlを返すことを前提としています。これは、現在のコードが毎回既存のリストを上書きすると言うときに説明しているようです。"load.php" が<li>
タグなしで新しい li のコンテンツのみを返す場合は、li を作成して前に追加できます。
$.get("load.php", function(data) {
$("<li/>").html(data).prependTo("#postbit").fadeIn("slow");
});
編集:継続的にリロードするには、上記を で呼び出す関数にラップするsetInterval()
か、次のようにします。
function getMoreData() {
$.get("load.php", function(data) {
$(data).prependTo("#postbit").fadeIn("slow");
}).complete(function() {
setTimeout(getMoreData, 3000);
});
}
getMoreData();
これは、3 秒後にsetTimeout()
の別の実行をスケジュールするために使用されますが、前の要求が完了した後に実行されます。getMoreData()
jQuery API を確認してください。AJAX の API は次のとおりです: http://api.jquery.com/category/ajax/
$.ajax({
url: 'load.php',
success: function(data) {
$("ul#postbit").prepend('<li>'+ data +'</li>');
}
});