1

写真を表示するためのページがあり、ユーザーはそれにコメントを送信でき
ます そのページで 30 秒ごとに ajax を使用して新しいコメントを読み込むための js ファイル名 (ajax.js) を
書き込みます。ユーザーは、すべてのコメントコメントの近くにある削除アイコンをクリックして、非表示にして
コードを削除しますfeed.js :

$('a[cm-del]').click(function () {
    var cmid = $(this).attr('cm-del');
    var typeid = $(this).attr('data-type');
    $('li[last-id=' + cmid + ']').effect('pulsate');
    $('li[last-id=' + cmid + ']').hide(300);
    $.post('/post/comment.php', {
        cmdelete: cmid,
        type: typeid
    }, function () {});
});
codes ajax.js:

function getmorecmphoto() {
    $('li[data-hiv]').hide();
    var lastid = $('li[last-id]:last').attr('last-id');
    if (lastid === '') {
        var lastid = 0;
    }
    var oldcm = $('div[comments-id]').html();
    var photoid = $('div[comments-id]').attr('comments-id');
    $.post('/post/photo.php', {
        lastid: lastid,
        photoid: photoid
    }, function (getlastcmphoto) {
        $('div[comments-id]').html(oldcm + getlastcmphoto);
    });
}
setInterval(getmorecmphoto, 25000);

初めてユーザーがこのページを開くと、最後の10件のコメントがロードされ
、すべてが正常に機能します
が、25〜30秒後に新しいコメントがajaxでロードされると、feed.jsが新しいコメントに対して機能しませんか?
これについて私は何をしなければなりませんか？
新しいコメントが読み込まれるたびにfeed.jsをロードしますが、10分でユーザーが約20のfeed.jsをロードするのは悪いことです!
他にできることはありますか？
ありがとうございました

4

3 に答える 3

1

イベント委任が必要です。イベントを最も近い静的 (動的にロードされていない) コンテナーにバインドし、アクションを委任します。

これを変える：

$('a[cm-del]').click(function(){

これに：

$(document).on('click','a[cm-del]',function(){

あなたのマークアップがどのように見えるかわからないので、ここでは代替としてドキュメントを使用しています。

注: jQuery <1.7 を使用している場合は、live()代わりにon()

$('a[cm-del]').live( 'click', function(){
于 2013-09-01T10:26:39.477 に答える
0

I think .live should work.

$('a[cm-del]').live("click",function(){
    var cmid = $(this).attr('cm-del');
    var typeid = $(this).attr('data-type');
    $('li[last-id='+cmid+']').effect('pulsate');
    $('li[last-id='+cmid+']').hide(300);
    $.post('/post/comment.php',{cmdelete:cmid,type:typeid},function(){
    });
});

If not work then do like this .. first change the feed.js like 

function SetEvent(){
      $('a[cm-del]').unbind("click").click(function(){
         var cmid = $(this).attr('cm-del');
         var typeid = $(this).attr('data-type');
         $('li[last-id='+cmid+']').effect('pulsate');
         $('li[last-id='+cmid+']').hide(300);
         $.post('/post/comment.php',{cmdelete:cmid,type:typeid},function(){
         });
       });
 }

Now change ajax.js like

function getmorecmphoto(){
    $('li[data-hiv]').hide();
    var lastid = $('li[last-id]:last').attr('last-id');
    if(lastid === ''){
        var lastid = 0;
    }
    var oldcm = $('div[comments-id]').html();
    var photoid = $('div[comments-id]').attr('comments-id');
    $.post('/post/photo.php',{lastid:lastid,photoid:photoid},function(getlastcmphoto){
        $('div[comments-id]').html(oldcm + getlastcmphoto);
         SetEvent();
    });
}
setInterval( getmorecmphoto, 25000 );

I think it will work. Thanks

于 2013-09-01T10:41:26.813 に答える