tipos - Hacer mientras el problema de JavaScript

script type= text/javascript src=

Question

Intento enviar varias publicaciones dentro de un ciclo de hacer pero el resultado no se agrega

<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>

La salida es: 5, 5, 5, 5, 5,

y necesito que la salida sea: 1, 2, 3, 4, 5,

Answer 1

La solicitud de Ajax es asíncrona, lo que significa que para cuando el controlador de éxito regrese, el ciclo ya está completo. En cambio, puede crear un cierre para preservar el valor:

success: (function(i){
    return function() {
         $(''div#append_result'').append(i + '',<br/>'');
    }
})(initval)

Answer 2

Debido a la naturaleza asincrónica de AJAX, para cuando su función de éxito se ejecuta para cualquiera de las solicitudes AJAX resultantes, el ciclo se ha completado y el initval está establecido en 5. Necesita capturar el estado de initval al inicio de cada solicitud y uso ese estado capturado en el método success() . Cerrar el valor es la forma más sencilla de hacerlo:

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);
}

Comprenda, sin embargo, que una o más solicitudes podrían colgarse en el servidor permitiendo que una última solicitud se complete primero, lo que podría resultar en 1, 2, 5, 3, 4 o algo así.

Además, el uso de la identificación de un elemento es mucho más rápido que el prefijo del selector de hash con el nombre de la etiqueta de elementos. Además, debe evitar volver a consultar el DOM para su resultado DIV cada vez que se ejecuta el éxito. Cógelo una vez y úsalo cuando sea necesario:

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);
}

Answer 3

Esto se debe al comportamiento asíncrono de ajax: aquí hay una versión modificada:

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();
        }  
    });
 }

Este es ahora un enfoque secuencial. Nota: Asumí que cada solicitud de AJA devuelve éxito, si hay un error, debe manejarlos en la devolución de llamada de error.