JQuery 将查询发布到两个不同的 php 文件

Posted 2023-05-08

【中文标题】JQuery 将查询发布到两个不同的 php 文件

【英文标题】：JQuery post query to two different php files

【发布时间】：2020-12-23 13:19:04

【问题描述】：

我有一个表单，它必须首先使用一个 php 进行验证，然后如果成功验证最近到另一个。 这是我的html表单

<form id="fr1" action='send.php'>
    <input type="text" name="name" placeholder="name">
    <input type="text" name="mail" placeholder="mail">
    <button type="submit">Send</button>
</form>

JQuery 处理提交事件，防止重定向和验证电子邮件

$(document).ready(function()
    $('#fr1').submit(function(e)
        e.preventDefault();
        $.ajax(
            type: 'POST',
            url: 'upload.php',
            data: $(this).serialize(),
            success: function(data)
                if (data)
                    $('#fr1').submit();
                
                else
                    alert('Invalid Credentials!');
                
            
        );
    );
);

然后轮到upload.php了。在这里……

<?php //upload.php
$mail = $_POST['mail'];
$mail = filter_var($mail, FILTER_VALIDATE_EMAIL);
echo $mail;

如果验证成功，我会尝试将此数据重新发送到其他页面并重定向到该页面。 上面的代码是我项目的最大简化版本，重建它对我来说非常痛苦-JQuery方法可以解决我的问题吗？

重要一点：在重定向之前必须有一个弹出窗口，其中包含成功的反馈，并且只有在重定向之后。

【问题讨论】：

我是 Ajax 的初学者，但 jsonData.res 来自哪里？您随后对submit() 的调用不会加载相同的函数吗？也许您需要捕获按钮按下以进行验证，然后致电submit()。

这是我的错误（在简化我的项目时）——它曾经是 json 响应，但我把它变成了简单的文本。你是说随后的 submit() 再次调用自己？但是回忆一下普通的表单提交呢？

您也可以通过 AJAX 发出第二个请求 - 然后您必须自己处理“重定向”部分，方法是在成功处理程序中为 location.href 分配一个新 URL。请注意，这将导致 GET 请求，因此您将无法再访问要重定向到的页面上的任何 POST 数据，必须在您发送 AJAX 请求的脚本中进行处理。替代方案：让表单在第二种情况下正常提交，不阻止事件默认操作，也不执行任何其他脚本操作。

【参考方案1】：

您为“#fr1”表单的提交事件设置了一个监听器，即当您提交表单时，您会阻止默认行为，这就是未提交表单的原因。

您可以通过使用 AJAX 将表单提交到upload.php 来实现您的需求，所有逻辑都应该用于验证/存储数据，然后会以成功或失败响应。

例子：

$(document).ready(function()
    $('#fr1').submit(function(e)
        e.preventDefault();
        $.ajax(
            type: 'POST',
            url: 'upload.php',
            data: $(this).serialize(),
            success: function(data)
                if (data.success)
                    alert(data.message);
                
                else
                    alert('Invalid Credentials!');
                
            
        );
    );
);

上传.php

<?php
if (isset($_POST)) 
    $mail = $_POST['mail'];
    if (!filter_var($mail, FILTER_VALIDATE_EMAIL)) 
        $data = ['success' => false, 'message' => 'invalid email'];
     else 
        $data = ['success' => true, 'message' => 'correct data'];
    
    echo json_encode($data);

希望对你有帮助

【参考方案2】：

如 cmets 中所述，使用

$("form").submit(function() 
    e.preventDefault();
    $("form").submit();
);

将陷入无限循环。关键是使用javascript原生的.submit()而不是jquery的：

$("form").submit(function() 
    e.preventDefault();
    $("form")[0].submit();
);

这将允许您暂时拦截提交，做您想做的事（通过 ajax 验证服务器端，显示一个弹出窗口），然后，完成后，让表单将其本机 POST 发送到您的替代页面。

这是一个示例 jsfiddle，在实际 POST（到另一个页面）之前有一个模拟延迟：https://jsfiddle.net/4z5d0ypr/