За последние 24 часа нас посетили 18708 программистов и 1670 роботов. Сейчас ищет 1751 программист ...

Вывод информации о загрузке данных

Тема в разделе "JavaScript и AJAX", создана пользователем Feudor55990, 7 май 2017.

  1. Feudor55990

    Feudor55990 Новичок

    С нами с:
    6 май 2017
    Сообщения:
    5
    Симпатии:
    0
    Здравствуйте, есть скрипт постраничной навигации с бесконечным скроллом, все работает нормально, но нужна помощь в его доработке, а именно, при нажатии на кнопку "Далее" (#more) подгружается еще 10 статей из базы данных, так вот, как вывести в определенный DIV надпись о том, что "Идет загрузка...", т.е. пока записи из БД выгружаются, и еще не вывелись, светится эта надпись!

    Вот код скрипта (здесь только JS, т.к. остальное в принципе и не нужно):

    /////////////////////////////////////////////////////////////////////////////////////////////
    $(document).ready(function(){

    var inProgress = false;
    var startFrom = 12;

    $('#more').click(function() {

    if($(window).scrollTop() + $(window).height() >= $(document).height() && !inProgress) {
    $.ajax({

    url: 'obrabotchik.php',
    method: 'POST',
    data: {"startFrom" : startFrom},
    beforeSend: function() {
    inProgress = true;}
    }).done(function(data){
    data = jQuery.parseJSON(data);
    if (data.length > 0) {
    $.each(data, function(index, data){
    $("#articles").append("<p><b>" + data.title + "</b><br />" + data.text + "</p>");

    });
    inProgress = false;
    startFrom += 10;
    }

    else {
    $("#more").css("display","none");
    $("#the_articles_ended").css("display","block");
    }});
    }
    });
    });

    /////////////////////////////////////////////////////////////////////////////////////////////

    и есть DIV, в который нужно отправить текст "Идет загрузка..."

    <div id="load"></div>

    если загрузка завершена, то текст, соответственно, исчезает
    Помогите плиз, что и где вписать))
     
  2. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
    Код (Javascript):
    1. $.ajax({
    2.     /* ... */
    3.     beforeSend: function() {
    4.         // действия перед началом запроса
    5.     },
    6.     complete: function() {
    7.         // действия после запроса
    8.         // даже, если тот завершился ошибкой
    9.     }
    10. }).done(function(data) {
    11.  
    12. });
    --- Добавлено ---
    P.S. Тут в редакторе кнопочка есть такая "+" , а там </> Код. Это чтобы самому не "разукрашивать" код ;)
     
  3. Deonis

    Deonis Старожил

    С нами с:
    15 фев 2013
    Сообщения:
    1.521
    Симпатии:
    504
  4. Feudor55990

    Feudor55990 Новичок

    С нами с:
    6 май 2017
    Сообщения:
    5
    Симпатии:
    0