Прикрутить к скрипту информацию о загрузке данных в виде loader.gif

Тема в разделе "JavaScript", создана пользователем Sergo_Sev, 17 авг 2013.

Статус темы:
Закрыта.
Модераторы: ZiX
  1. Sergo_Sev

    Sergo_Sev Творец

    Регистр.:
    14 июн 2008
    Сообщения:
    571
    Симпатии:
    188
    Есть скрипт который обращается к php файлу и подгружает данные в течении 10 секунд
    Нужно прикрутить либо сообщение о загрузке данных либо изображение по типу loader.gif, что бы до вывода данных из скрипта было видно, что скрипт работает

    Код:
    <html>
    <head>
        <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="jquery.validate.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
            $("#myform").validate({
                submitHandler: function(form) {
                    // do other stuff for a valid form
                    $.post('process.php', $("#myform").serialize(), function(data) {
                        $('#results').html(data);
                    });
                }
            });
        });
        </script>
    </head>
     
    <body>
    <form name="myform" id="myform" action="" method="POST" align="center">
    <input type="text" name="11" value="1" style="width:25;">
     
    </br></br>
    <input type="submit" value="Вычислить">
    </form>
    <div id="results"><div>
    </body>
    </html>
     

    Вложения:

    • 11111.zip
      Размер файла:
      31 КБ
      Просмотров:
      2
  2. Genk0

    Genk0 Инквизитор из раздела J!

    Moderator
    Регистр.:
    2 июн 2010
    Сообщения:
    1.627
    Симпатии:
    1.330
  3. antiterror

    antiterror xProgramming

    Регистр.:
    22 авг 2007
    Сообщения:
    343
    Симпатии:
    135
    На всякий случай отпишусь, что бы на будущее не задавали такие вопросы когда есть google.

    У вас есть DIV где выводится информация, вот туда перед загрузкой ajax вам нужно загрузить нужную информацию или loader gif.

    Выглядит это так:
    HTML:
    
    <script type="text/javascript">
        $(document).ready(function(){
            $("#myform").validate({
                submitHandler: function(form) {
     
     
                    $('#results').html('<img src="path_to_loading_img/loader.gif" alt="Loading" />');
                    или такой вариант
                    $('#results').html("Идёт загрузка данных...");
     
     
                    // do other stuff for a valid form
                    $.post('process.php', $("#myform").serialize(), function(data) {
                        $('#results').html(data);
                    });
                }
            });
        });
    </script>
    
    Где path_to_loading_img нужно указать путь к изображению.
    Всё остальное не нужно даже трогать.
    И всё, проблема с загрузкой решена.
     
    Sergo_Sev нравится это.
  4. Sergo_Sev

    Sergo_Sev Творец

    Регистр.:
    14 июн 2008
    Сообщения:
    571
    Симпатии:
    188
    Отлично, именно то что искал, просто погуглил по первым запросам, что пришли в голову и ничего подходящего не нашел
    Хотя в этом варианте информация о загрузке не убирается

    А вообще первый вариант прикрутил - вышло отлично
     
Статус темы:
Закрыта.