Делать, пока проблема с JavaScript - PullRequest
Новая
       4

Делать, пока проблема с JavaScript

1 голос
/ 05 августа 2011

Я пытаюсь отправить несколько сообщений в цикле do while, но результат не добавляется 

<script type="text/javascript">
function action() {
    var initval = 1;
    var endval = 5;
    do {
    var action_string = 'txtuser=someone';

    $.ajax({
                    type: "POST",
                    url: "http://localhost/js.php",
                    data: action_string,
                    success: function(result){
                       $('div#append_result').append(initval + ',<br/>');
                     }  
                });
    initval++;
     } while (initval <= endval);
  }
</script>

Выход: 5, 5, 5, 5, 5

и мне нужен вывод: 1, 2, 3, 4, 5

Ответы [ 3 ]

6 голосов
/ 05 августа 2011

В связи с асинхронной природой AJAX, к тому времени, когда ваша функция успеха выполняется для любого из результирующих запросов AJAX, цикл завершен и для initval установлено значение 5. Вам необходимо зафиксировать состояние initval вначало каждого запроса и использовать это захваченное состояние в методе success().Закрытие по значению - это самый простой способ сделать это: 

function action() {
    var initval = 1;
    var endval = 5;
    do {
        var action_string = 'txtuser=someone';

        ( function( captured_initval ){
            $.ajax({
                type: "POST",
                url: "http://localhost/js.php",
                data: action_string,
                success: function(result){
                    $('div#append_result').append(captured_initval + ',<br/>');
                }  
            });
        }( initval ) );

        initval++;
    } while (initval <= endval);
}

Однако следует понимать, что один или несколько запросов могут зависнуть на сервере, что позволяет последнему завершить первый запрос, что может привести к 1, 2, 5, 3, 4 или что-то в этом роде.

Кроме того, использование идентификатора элемента намного быстрее, чем добавление префикса хэша к имени тега elements.Кроме того, вы должны избегать повторного запроса DOM для вашего результата DIV при каждом успешном запуске.Возьмите его один раз и используйте при необходимости: 

function action() {
    var initval = 1;
    var endval = 5;
    do {
        var action_string = 'txtuser=someone',
            $AppendResult = $('#append_result');

        ( function( captured_initval ){
            $.ajax({
                type: "POST",
                url: "http://localhost/js.php",
                data: action_string,
                success: function(result){
                    $AppendResult.append(captured_initval + ',<br/>');
                }  
            });
        }( initval ) );

        initval++;
    } while (initval <= endval);
}
3 голосов
/ 05 августа 2011

Ajax-запрос является асинхронным, что означает, что к моменту возврата обработчика успеха цикл уже завершен.Вместо этого вы можете создать замыкание для сохранения значения: 

success: (function(i){
    return function() {
         $('div#append_result').append(i + ',<br/>');
    }
})(initval)
2 голосов
/ 05 августа 2011

Это из-за асинхронного поведения ajax: вот модифицированная версия: 

var initval = 1;
var endval = 5;
function action(){
    var action_string = 'txtuser=someone';
    $.ajax({
        type: "POST",
        url: "http://localhost/js.php",
        data: action_string,
        success: function(result){
           $('div#append_result').append(initval + ',<br/>');
           initval++;
           if(initval<=endval)
            action();
        }  
    });
 }

Это теперь несколько последовательный подход.Примечание: я предполагал, что каждый ajax-запрос возвращает успех, если есть ошибка, вы должны обработать их при обратном вызове ошибки.

...