$ .Ajax отправлять с индикатором выполнения с помощью jquery - PullRequest
Новая
       2

$ .Ajax отправлять с индикатором выполнения с помощью jquery

1 голос
/ 23 декабря 2010

Привет, ребятаЯ использую функцию $ .ajax для отправки данных на сервер, и с помощью этого метода я удалил большинство страниц обратной передачи, это работает, но мне нужен какой-то индикатор выполнения, чтобы показать посетителям некоторый прогресс, теперь он ничего не показывает, через несколько секунд он показывает результат, но я думаюсообщение или небольшая картинка нужна на моем веб-сайте.Как я могу реализовать это с помощью простого кода JQuery?что-то всплывающее и показывает, что страница находится в процессе.

А также мне нужно добавить какой-нибудь другой jquery, чтобы предотвратить другой щелчок во время процесса, возможно ли это?

Ответы [ 2 ]

2 голосов
/ 23 декабря 2010

Вы можете сделать что-то вроде 

$("elemnt").click(function(){
    $("loader-img").show();

    $.ajax({
        url : "your url",
        complete: function(){
            $("loader-img").hide();
        }
    });    
});

Изображение загрузчика может быть div, блокирующим страницу, чтобы запретить пользователю делать что-либо с изображением в центре области просмотра.

Здесь используется событие complete, так как это событие вызывается в случае успешного / неудачного запроса ajax.

EDITED. Вы можете сделать что-то вроде 

<style type="text/css">
    .blocker{
        z-index: 99999;
        opacity: .5;
        height: 100px;
        position: fixed;
        background: none repeat scroll 0 0 lightgrey;
        width: 100%;
    }

    .blocker .img{
        position: fixed;
        color: red;
    }
</style>

<body>
    <div class="blocker" style="display: none">
        <div class="img">img</div>
    </div>
    .............
    .............
    .............

Then In Script 

function showBlocker(){
    $(".blocker .img").css({
        top: $(window).height() / 2,
        left: $(window).width() / 2
    });
    $(".blocker").show().css({
        height: $(document).height()
    });
}

Затем вызовите метод showBlocker(), чтобы показать блокировщик.

Вы можете настроить ответ так, чтобы он соответствовал вашим потребностям.Это всего лишь пример того, как этого можно достичь

1 голос
/ 23 декабря 2010

Вы можете показать загрузочное изображение до начала вызова AJAX, а затем скрыть его в функции обратного вызова.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...