2013-11-14 2 views
0

В настоящее время я использую эту функцию, но она может только обновить весь #comments div.Параметр jquery AJAX «cache» отвечает моим потребностям?

$.ajax({ 
    url: 'WebForm1.aspx', 
    success: function (data) { 
    $("WebForm1.aspx #comments").html(data); 
    } 
}); 

Я пытаюсь выяснить, если JQuery AJAX может обнаружить никакой разницы между тем, что пользователь активно просмотре веб-страницы, а также то, что приходит из базы данных, так что всякий раз, когда кто-то добавляет комментарий, посетители увидеть входящий комментарий как затухание в, а не весь #comments div, периодически обновляющийся.

Вот рабочий процесс, который я хочу:

запрос AJAX 1 -> JQuery выбирает Data A, данные B, C данных и отображает их в на # комментарий браузера, сохраняет его в своем кэше.

(Данные D добавляется в БД несколько позже) запрос

АЯКСА 2 -> JQuery извлекает данные А, данные B, данные С и данными D, сравнивает с кэшем в браузере и обнаруживает, что данные D отсутствовали в предыдущей версии #comments и исчезают только в новых данных D.

Как это сделать? Пожалуйста помоги. Благодарю.

ответ

2

Ни jQuery, ни jQuery.ajax не могут (или mea nt) делать то, что вы просите. Логика сравнения должна быть выполнена самостоятельно.

У меня есть несколько предложений:

  1. Вызов к серверу для ваших данных должны принимать параметр временных меток. Если параметр не задан, верните весь набор комментариев, включая метку времени с текущим временем. Если параметр timestamp установлен, найдите комментарии, которые были отправлены с тех пор, отправьте только те, вместе с отметкой времени текущего времени. Временная метка с сервера сохраняется на клиенте и отправляется вместе с каждым последующим запросом. Таким образом, вы всегда получаете только новые комментарии. Добавьте эти новые комментарии на экран в нужную позицию и с нужной анимацией.
  2. Вышеизложенное требует значительных изменений. Если вы не можете этого сделать, используйте свой текущий код. Всякий раз, когда комментарии загружаются, найдите dom для первого элемента с атрибутом data-comment_id. Значение этого атрибута - это самый высокий идентификатор комментария (при условии, что вы не можете повторно заказывать комментарии, иначе ваш чек должен быть более надежным). В обратном вызове успеха найдите параметр данных (который является html) для элементов с атрибутом data-comment_id и выбросите все после того, как элемент с значением data-comment_id на 1 больше, чем самый высокий идентификатор комментария, который у вас был до сих пор. Добавьте html, который вы оставили в dom с нужной анимацией.

Надеюсь, что поможет вам попасть на правильный путь.

+0

большое спасибо. – thenewseattle

+0

+1 для объяснения того, что мне было слишком лениво делать – MonkeyZeus

0

Вам потребуется какое-то setInterval постоянно выяснить, что последнее замечание было и получать новые данные после последних комментариев ID

JS

// check every ten seconds 
setInterval(function() { 

    // figure out most recent comment and pass it to the URL so your query can search for anything greater than newest_comment 
    $.ajax({ 
     url: 'WebForm1.aspx', 
     type: 'GET', 
     data: {'newest_comment':$('#comments').find('span.comment:eq(0)').data('comment_id')}, // newest_comment would be 5 
     dataType: 'HTML', 
     success: function (data) { 
      $("#comments").prepend(data); 
     } 
    }); 

}, 10000); 

Возможные HTML

<div id="comments"> 
    <span class="comment" data-comment_id="5"></span> 
    <span class="comment" data-comment_id="4"></span> 
    <span class="comment" data-comment_id="3"></span> 
    <span class="comment" data-comment_id="2"></span> 
    <span class="comment" data-comment_id="1"></span> 
</div> 
Смежные вопросы