Php 在结帐过程中逐步提交表单jQuery

我正在一个购物页面工作，现在是结帐区。我想展示一个进度，首先询问制造地址，然后是发货地址、付款等，如下所示：

我有对应于签出进度步骤的以下代码

<div class="progressContent" >

    <form id="form1" class="update_form" action="" method="post">
        <ul>
            <li>
                <h2>Dirección de facturación</h2>
                <p>
                    Introduzca la dirección a la que quiere asociar la facturación de la compra, no el envío.
                </p>
            </li>
            <li>
                <label for="nombre">Nombre:</label>
                <input type="text" name="nombre" value="<?php echo $name[0] ?>" required />
            </li>
            <li>
                <label for="apellidos">Apellidos:</label>
                <input type="text" name="apellidos" value="<?php echo $name[1]." ".$name[2] ?>" required />
            </li>
            <li>
                <label for="direccion">Dirección:</label>
                <input type="text" name="direccion" value="<?php echo $calle ?>" required />
            </li>
            <li>
                <label for="ciudad">Ciudad:</label>
                <input type="text" name="ciudad" value="<?php echo $localidad ?>" required />
            </li>
            <li>
                <label for="localidad">Localidad:</label>
                <input type="text" name="localidad" value="" required />
            </li>
        </ul>
    </form>

    <form id="form2" class="update_form" action="" method="post">
        <ul>
            <li>
                <h2>Dirección de envio</h2>
                <p>
                    Introduzca la dirección en la que desea recibir el pedido.
                </p>
            </li>
            <li>
                <label for="nombre">Nombre:</label>
                <input type="text" name="nombre" value="<?php echo $name[0] ?>" required />
            </li>
            <li>
                <label for="apellidos">Apellidos:</label>
                <input type="text" name="apellidos" value="<?php echo $name[1]." ".$name[2] ?>" required />
            </li>
            <li>
                <label for="direccion">Dirección:</label>
                <input type="text" name="direccion" value="<?php echo $calle ?>" required />
            </li>
            <li>
                <label for="ciudad">Ciudad:</label>
                <input type="text" name="ciudad" value="<?php echo $localidad ?>" required />
            </li>
            <li>
                <label for="localidad">Localidad:</label>
                <input type="text" name="localidad" value="" required />
            </li>
        </ul>
    </form>

    <form id="form3" class="update_form" action="" method="post">
        <ul>
            <li>
                <h2>Método de envío</h2>
                <p>
                    Seleccione el método de envío que desea. Los gastos de envío corren a cargo del cliente.
                </p>
            </li>
        </ul>

        <div class="envio normal" title="Envío normal">
            Envío normal
        </div>
        <p class="textoEnvio">
            Se relizará la entrega por parte de la empresa tal, el tiempo estimado son unos 3 días laborables.
        </p>
        <div class="envio express" title="Envío rápido">
            Envío express
        </div>
        <p class="textoEnvio">
            Se relizará la entrega por parte de la empresa tal, el tiempo estimado son unos 2 días laborables.
        </p>
        <p class="nota">
            <span style="color:red;">*</span>Recuerda que los gastos de envío no están incluidos en el precio, y se habrían de pagar en el momento de la entrega.
        </p>
    </form>

    <form id="form4" class="update_form" action="" method="post">
        <ul>
            <li>
                <h2>Método de pago</h2>
                <p>
                    Seleccione el método de pago preferido para realizar la compra actual.
                </p>
            </li>

            <li>
                <input id="tarjeta" class="pago" type="radio" name="tipoPago" value="tarjeta">
                <label class="selectorPagos tarjeta" for="tarjeta"></label>
            </li>
            <li>
                <input id="paypal" class="pago" type="radio" name="tipoPago" value="paypal">
                <label class="selectorPagos paypal" for="paypal"></label>
            </li>
            <li>
                <input id="ingreso" class="pago" type="radio" name="tipoPago" value="cuenta">
                <label class="selectorPagos ingreso" for="ingreso"></label>
            </li>
        </ul>
    </form>

</div>
<div class="progressBottons" >
    <a href="#" class="botonComprar compra" id="continuar" title="Siguiente" type="button" >Continuar</a>
    <a href="#" class="botonComprar " id="anterior" title="Atrás" type="button" >Anterior</a>
</div>

---

但这不起作用。怎样才能做到这一点呢？我确保表单选择正确。

什么不正确？AJAX查询启动了吗？如果您输出数据字符串，它看起来像什么？您是否尝试过使用来确定错误？AJAX查询火灾，数据字符串内容nombre=&apellidos=&direccion=&ciudad=&localidad=，所以工作正常，但是AJAX url，我有php文件，返回一个字符串，ej。“好的”。但是当我打印“数据”时，什么也看不出来。我已经解决了它，问题是，当您使用jquery进行asyn submit时，首先必须调用

.submit（）

方法，然后创建处理程序

.submit（函数（）{//whatever}

）。

$('.progressContent').on('click','#continuar', function(e) {
    e.preventDefault();

    $('.progressContent').children('.update_form').eq(i-2).submit( function() {

        dataString = $('.progressContent').children('.update_form').eq(i-2).serialize();

        $.ajax({
            type: "POST",
            url: "./php/api.php?facturacion=1",
            data: dataString,
            dataType: "json",
            success: function(data) {
                console.log(data);
            }
        });
        return false;
    });


    setInterval();

});