javascript - 在新窗口中发布会出现空白页面(jquery)

Question

尝试发布到新窗口，但打开新窗口，却给了我一个空白的关于页面。

在alignet.js中

//first_step
$('form').submit(function(){ return false; });
$('#submit_first').click(function(){

    //remove classes
    $('#first_step input').removeClass('error').removeClass('valid');
    //ckeck if inputs aren't empty
    //var fields = $('#first_step input[type=text]');
    var error = 0;
    $( ':input[type=text]', '#first_step').each( function () {
        if ( this.value.trim() == false ) {
            $(this).addClass('error');
            error++;
        }
    });
    if(!error) {
        //update progress bar
        $('#progress_text').html('50% Complete');
        $('#progress').css('width','113px');
        //slide steps
         $('#first_step').slideUp();
         dataString = $("#first_step input").serialize();
         //alert(dataString);
         $.ajax({  
             type: "POST", 
             url: "../../wp-content/plugins/oci-alignet/process.php",
             data: dataString,  
             success: function(data) { 
                 var alignet_encrypted = jQuery.parseJSON(data);
                 $("input[name=XMLREQ]").val(alignet_encrypted.XMLREQ);
                 $("input[name=SESSIONKEY]").val(alignet_encrypted.SESSIONKEY);
                 $("input[name=DIGITALSIGN]").val(alignet_encrypted.DIGITALSIGN);                     
             }
         },
         "json");             
         $('#second_step').slideDown();
    } else return false;
});

生成 php

$html = '<!-- #first_step -->
    <div id="first_step">
        <h1>Informacion General</h1>
        <h5>Recuerden que SITENAME no pide numero de tarjeta ni su cuenta Bancario</h5>
        <div class="form">
            <label for="purchaseCommerceAmount">Valor (USD):</label>
                <input type="text" name="purchaseCommerceAmount" id="purchaseCommerceAmount" value="20.00" />
            <label for="billingFirstName">Nombre del tarjetahabiente. (como aparece en la tarjeta de crédito):</label>
                <input type="text" name="billingFirstName" id="billingFirstName" value="" />         
            <label for="billingLastName">Apellido del tarjetahabiente. (como aparece en la tarjeta de crédito) :</label>
                <input type="text" name="billingLastName" id="billingLastName" value="" />
            <label for="billingEMail">Dirección electrónica del tarjetahabiente.:</label>
                <input type="text" name="billingEMail" id="billingEMail" value="" />
            <label for="billingAddress">Dirección del tarjetahabiente:</label>
                <input type="text" name="billingAddress" id="billingAddress" value="" />
            <label for="billingZIP">Código Postal del tarjetahabiente:</label>
                <input type="text" name="billingZIP" id="billingZIP" value="XX000" />
            <label for="billingCity">Nombre de la ciudad del tarjetahabiente:</label>
                <input type="text" name="billingCity" id="billingCity" value="" />
            <label for="billingState">Nombre del estado del tarjetahabiente:</label>
                <input type="text" name="billingState" id="billingState" value="" /> 
            <label for="billingCountry">Código (eg: EC,BR,AR) del país del tarjetahabiente:</label>
                <input type="text" name="billingCountry" id="billingCountry" value="EC" />
            <label for="billingPhone">Teléfono del tarjetahabiente:</label>
                <input type="text" name="billingPhone" id="billingPhone" value="" />        
            <label for="shippingFirstName">Nombre de la persona que recibirá los bienes:</label>
                <input type="text" name="billingFirstName" id="billingFirstName" value="" />         
            <label for="shippingLastName">Apellido del tarjetahabiente. (como aparece en la tarjeta de crédito) :</label>
                <input type="text" name="billingLastName" id="billingLastName" value="" />
            <label for="shippingEMail">Email de la persona que recibirá los bienes:</label>
                <input type="text" name="shippingEMail" id="shippingEMail" value="" />
            <label for="shippingAddress">Dirección de entrega del pedido del tarjetahabiente:</label>
                <input type="text" name="shippingAddress" id="shippingAddress" value="" />
        </div>      
        <!-- clearfix -->
        <div class="clear">
        </div>
        <!-- /clearfix -->
        <input class="submit" type="submit" name="submit_first" id="submit_first" value="Continuar" />
    </div>      
    <!-- #second_step -->    
    <form id="second" method="POST" action="https://test2.alignetsac.com/VPOS/MM/transactionStart20.do" target="foo" onSubmit="window.open(\'\', \'foo\', \'width=450,height=300,status=yes,resizable=yes,scrollbars=yes\')">
    <div id="second_step">
        <h2>DATA COMPILED READY TO SEND</h2>
        <div class="form">
            <label for="XMLREQ">XMLREQ</label>
            <input type="text" name="XMLREQ" id="XMLREQ" value="" />
            <label for="DIGITALSIGN">DIGITALSIGN</label>
            <input type="text" name="DIGITALSIGN" id="DIGITALSIGN" value="" />
            <label for="SESSIONKEY">SESSIONKEY</label>
            <input type="text" name="SESSIONKEY" id="SESSIONKEY" value="" />
            <lable for"URLVPOS">URLVPOS</label>
            <select name="URLVPOS" id="URLVPOS">
                <option value="https://test2.alignetsac.com/VPOS/MM/transactionStart20.do">preprod.verifika.com</option>
            </select>

        </div>
        <!-- clearfix --><div class="clear"></div><!-- /clearfix -->
        <input class="submit" type="submit" name="submit_second" value="Send" />
        <!-- clearfix --><div class="clear"></div><!-- /clearfix -->
    </div>
    </form>      
    <div id="progress_bar">
    <div id="progress"></div>
    <div id="progress_text">0% Complete</div>
    </div>';
return $html;

}

https 链接工作正常。 Vpos数据在表单中设置。

Answer 1

没有真正需要使用 AJAX/jquery 来以新表单打开表单输出。提交按钮将自动提交表单，因此您只需编辑它的目标:

<form name="input" action="html_form_action.php" method="get" target="_blank">

确保调用的响应不为空，无论 ajax 部分如何