Загрузка содержимого в PHP-файл с помощью jQuery

#php #javascript #jquery

Вопрос:

У меня есть приведенный ниже код, загружаемый в содержимое, которое у меня есть в test.php досье. В php-файле много кода, поэтому загрузка занимает немного времени. Когда он загружается, текст «загрузить содержимое» остается. Я хочу иметь возможность: — отображать символ загрузки во время загрузки страницы — скрывать текст «загрузить содержимое» после появления содержимого

Как мне это сделать?

     <script type="text/javascript">
          $(document).ready(function(){
            $("a").click(function(){
            $("#test").load('test.php');
          });
       });
    </script>

<div id="test"></div>
<a>Load content</a>

Обновить:

Также я хотел бы, чтобы это была ссылка (поскольку в настоящее время она не работает на сенсорном устройстве) — есть предложения?

1. Либо поместите Load content его в свой div, как сказал OptimusCrime, либо просто скройте его: $("a").hide();

2. Сначала получите загрузочное изображение . Покажите его перед вызовом load . Затем в load обратном вызове скройте a тег.

3. Может быть, вам нужно добавить href атрибут в a тег?

4. По какой-то причине он не работал с атрибутом href… Это сейчас… Ого! Спасибо.

5. О a-теге. Попробуйте добавить href=»#»

Ответ №1:

Вы можете либо вложить <a> тег внутрь <div id="test"> тега, чтобы он удалялся .load() по завершении функции, либо добавить код для скрытия / удаления <a> тега в функции обратного вызова для вызова AJAX:

 <div id="test"><a>Load content</a></div>

Или в вашем JavaScript

 $("a").click(function(){
    /*Code to show loading message*/
    $("#test").load('test.php', function () {
        //this is a callback function that will fire after the data from test.php is loaded into the test div
        $('a').hide();//or you can use .remove() to completely remove the tag
        /*Code to remove the loading message*/
    });
});

Ответ №2:

Поместите загружаемое содержимое внутри div. Загрузка перезапишет это, когда это будет сделано.

Ответ №3:

Пожалуйста, ознакомьтесь с документацией jQuery для .load(). Вот как вы можете этого добиться:

 <script type="text/javascript">
    $(document).ready(function(){
        $("a").click(function(){
            // Display a loading message:
            $("#test").html('<p>Loading...</p>');

            // Load our data:
            $("#test").load('test.php', function() {
                // Code here runs when the load() completes:
                $("a").hide();
            });
        });
    }); </script>

<div id="test"></div> <a>Load content</a>

Ответ №4:

Переключитесь на $.ajax(). $.load и $.get являются вспомогательными методами быстрого доступа к методу master .ajax(), который позволяет использовать гораздо больше параметров конфигурации.

Установите анимацию загрузчика в обратном вызове beforeSend и удалите ее в обратном вызове onComplete (этот обратный вызов выполняется независимо от того, является ли извлечение успешным или ошибочным). Возможно, вы захотите выполнить другие действия в обратных вызовах успеха / ошибки соответственно.

http://api.jquery.com/jQuery.ajax/

1. Честно говоря, это ничего не дает для ответа на вопрос. load() явно «достаточно хорош» для того, что он делает, и использование ajax() не поможет ему убрать «Загружаемый контент» (на основе его текущей разметки).

Ответ №5:

Вам нужно использовать «печать» в вашем PHP-скрипте.

Когда я делаю это, я использую jquery ajax и показываю ответ в onSuccess