Как показать загрузку GIF-изображения во время загрузки контента, вызываемого через javascript? - PullRequest
Новая
       3

Как показать загрузку GIF-изображения во время загрузки контента, вызываемого через javascript?

3 голосов
/ 14 октября 2011

На моей странице есть JavaScript, который загружает новый контент в <div id="content"></div> с другой страницы, расположенной по адресу: inc/content.php.Я хотел бы знать, как я могу показать анимированное изображение GIF loading.gif в <div id="content"></div>, когда в него загружается новый контент?и после загрузки скрыть gif и показать новое содержание?

Спасибо))) Вот мой код: 

<html>
<head>

<script type="text/javascript" src="js/jquery-1.6.4.js"></script>
<script type="text/javascript">
function viewNext()
{
$("#content").load("inc/content.php");
}
</script>

</head>
<body>

<button id="nextfLuky" onClick="viewNext();return false;">Next fLuky</button>

<div id="content"></div>

</body>
</html>

содержимое на странице inc / content.php: 

<div id="text">Hello</div>

Ответы [ 3 ]

9 голосов
/ 14 октября 2011 
function viewNext(){
    $('#content').html('<img src="loading.gif" />').load("inc/content.php");
}

Когда вы используете load (), он заменит что-либо в элементе, включая gif, так что вам не придется его скрывать вручную.

3 голосов
/ 14 октября 2011 
function viewNext()
    {
    $('#content').html('<img src="/images/loading.gif" />');
    $("#content").load("inc/content.php");
}

Это сделает это.

0 голосов
/ 14 октября 2011 
    $('#content').append('<img id="delete_me_spinner2" src="/images/ajax-loader.gif" border="0" style="text-decoration: none" alt="Loading" />');
    var y = $.post(.....)
                .complete(function(data) {
                $('#delete_me_spinner2').remove();
    //check ajax went ok
        });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...