Question

我的问题是我需要将XML数据发布到付款网关。

我尝试遵循PHP Redirect with POST data的回答，但是我需要拦截提交内容以操纵数据。

因此，我尝试了以下操作：

<html>
<form id="myForm" action="<?php echo $url; ?>" method="post">

</form>
<script type="text/javascript">
$(document).ready (function () {
    document.getElementById('myForm').submit();

    $('#myForm').submit(function (e) {
        console.log('A');

        e.preventDefault();

        alert("a");

        $.post("<?php echo $url; ?>", {'data': formxml}, function (data) {
            // callback logic
        });
    });
});
</script>
</html>

但是，它没有按我预期的那样工作。

当我执行document.getElementById('myForm').submit()时，我期望$('#myForm').submit会拦截它并且可以进行数据验证。

我应该如何进行操作才能达到预期效果？

Answer 1

快速指针-逐行解释Javascript。意思是第一行在第二行之前执行。

在您的情况下，以下行：

document.getElementById('myForm').submit();

之前已被执行：

$('#myForm').submit(function (e) {
    console.log('A');

    e.preventDefault();

    alert("a");

    $.post("<?php echo $url; ?>", {'data': formxml}, function (data) {
        // callback logic
    });
});

从而导致submit()在您的处理程序有机会绑定到表单之前被触发。

尝试互换它们。以下代码有效：

<html>
<form id="myForm" action="<?php echo $url; ?>" method="post">

</form>
<script type="text/javascript">
$(document).ready (function () {
    $('#myForm').submit(function (e) {
        console.log('A');

        e.preventDefault();

        alert("a");

        $.post("<?php echo $url; ?>", {'data': formxml}, function (data) {
            // callback logic
        });
    });

    $('#myForm').submit();
});
</script>
</html>

让我知道这是否不是您期望的结果。

Answer 2

问题是当jQuery设置事件侦听器时，您正在使用普通JavaScript触发提交。更改

document.getElementById('myForm').submit();

到

$('#myForm').submit();

您应该会看到预期的结果。

如何拦截自动提交表格？

2 个答案: