Question

首先，原谅我完全缺乏技能。

我们有一个网站，其中包含一个简单的滑入式表单（如果用户点击，则会显示），它向我们发送一个请求，以便向用户返回呼叫。我们要求姓名，电子邮件，电话号码和通话时间。

数据通过$.post发送到另一个php文件，但html中没有任何<form>标记，只有<input>个标记。所以我假设JS / JQuery（我不知道该怎么称呼它）是捕获和发送输入字段中输入的数据。

我需要收集所有这些输入（时间除外）并将其发送到我们签约的营销服务提供商的API。

所以，这就是表格目前所做的事情：

第一部分是实际需要的

<script>
$(document).ready(function() {
    $('#G4_Envia').click(function() {
        var Nome = $('#g4_nome').val();
        var Email = $('#g4_email').val();
        var Telefone = $('#g4_telefone').val();
        var Horario = $('#g4_horario').val();

第二部分不相关，但如果有人需要，我会把它放在这里。

if (Nome != '' && Email != '' && Telefone != '' && Horario != '')
        {
            $('.liga_form').hide(300);
            $('.liga_wait').show(300);

            $.post("<?=$URL_BASE?>Paginas/G4Liga/Acoes/Envia.php", {nome: Nome, email: Email, telefone: Telefone, horario: Horario}, function() {
                $('.liga_wait').hide(300);
                $('.liga_done').show(300);
            });
        }
    });
});
</script>

在此脚本之后，开始“假”形式：

<div class="cursos-categorias boletim">
<hgroup>
    <h2>G4 Liga para você</h2>
    <h4 class="boletimTexto">Deixe seu nome e telefone nos campos abaixo e ligaremos para você.</h4>
</hgroup>
<div class="g4_liga">
    <div class="liga_form">
        <div>
            <input type="text" id="g4_nome" class="inputHome" placeholder="Nome"/>
        </div>

        <div>
            <input type="text" id="g4_email" class="inputHome" placeholder="E-Mail"/>
        </div>

        <div>
            <input type="text" id="g4_telefone" class="inputHome stdmask-phone" placeholder="Telefone"/>
        </div>

        <div>
            <input type="text" id="g4_horario" class="inputHome stdmask-hora" placeholder="Horário de preferência"/>
        </div>

        <button id="G4_Envia" class="btHome">Enviar</button>
    </div>

    <div class="liga_wait">
        <b>Aguarde,</b><br/>
        solicitação em andamento
    </div>

    <div class="liga_done">
        Solicitação Enviada
    </div>
</div>

之后，我必须加载服务提供者脚本：

<script type ='text/javascript' src="https://d335luupugsy2.cloudfront.net/js/integration/stable/rd-js-integration.min.js"></script>

所以，提供者指示我把这个代码结构放在后面（这只是一个例子）：

<script type ='text/javascript'>
    var data_array = [
        { name: 'email', value: 'integracao@test.com' },
        { name: 'identificador', value: 'YOUR_IDENTIFIER_HERE' },
        { name: 'token_rdstation', value: 'YOUR_TOKEN_HERE' },
        { name: 'nome', value: 'Test' }
    ];
 RdIntegration.post(data_array, function () { alert('callback'); });
</script>

提供RdIntegration提供的功能，用于发送数据。

我写了这个：

<script type="text/javascript">
 var data_array = [
    { name: 'nome', value: Nome },
    { name: 'email', value: Email },
    { name: 'telefone', value: Telefone },
    { name: 'token_rdstation', value: '5535eb5bc797b015477039eddba3c803' },
    { name: 'identificador', value: 'G4-liga' }
 ];
 RdIntegration.post(data_array);

它不起作用。

我对这些价值观做错了吗？我应该把它放在第一个脚本中吗？

对于愚蠢和长篇文章感到抱歉，但我希望我能解释清楚。

提前致谢。：）

Answer 1

您应该能够使用jQuery的serializeArray函数将输入值编码为对象数组，然后通过自定义类方法发布。

var data_array = $('.liga_form :input').serializeArray();
RdIntegration.post(data_array);

编辑注意：只有在您的输入具有名称属性时才会有效。

Answer 2

这很简单，您只需在当前表单发送表单数据后立即从您的提供程序进行集成。

$.post("<?=$URL_BASE?>Paginas/G4Liga/Acoes/Envia.php", {nome: Nome, email: Email, telefone: Telefone, horario: Horario}, function() {
    $('.liga_wait').hide(300);
    $('.liga_done').show(300);
    // put your integration here....
});

因此，您的最终代码可能如下所示：

$.post("<?=$URL_BASE?>Paginas/G4Liga/Acoes/Envia.php", {nome: Nome, email: Email, telefone: Telefone, horario: Horario}, function() {
    $('.liga_wait').hide(300);
    $('.liga_done').show(300);

    var data_array = [
        { name: 'nome', value: Nome },
        { name: 'email', value: Email },
        { name: 'telefone', value: Telefone },
        { name: 'token_rdstation', value: '5535eb5bc797b015477039eddba3c803' },
        { name: 'identificador', value: 'G4-liga' }
     ];
    RdIntegration.post(data_array);
});

JQuery捕获表单（不是html表单）数据并发送到另一个位置

2 个答案: