PHP 从不接收嵌套的 jQuery $.post 数据

Question

我正在尝试将简单表单​​数据从我的索引页发送到 PHP 函数 checklogin.php。我发现没有数据，序列化甚至直接输入，都没有进入 PHP 函数。我知道 jQuery 函数被调用了，我也知道 PHP 文件被调用是因为我在其中放入了各种 post 函数。

当我使用action="checklogin.php" 直接从表单提交数据时，$_POST 数据被正确接收并且我可以处理它。但是使用jQuery拦截表单提交时，没有收到任何数据。

需要注意的是，实际的登录表单 HTML 是从另一个页面插入的，以便我可以处理多个页面而不是一个大索引文件。

表单 - login.php

<form id="loginform" name="loginform" method="post">
    <td>
        <table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FFFFFF">
            <tr>
                <td colspan="3"><strong>Member Login</strong></td>
            </tr>
            <tr>
                <td width="78">Username</td>
                <td width="6">:</td>
                <td width="294"><input name="username" type="text" id="username"></td>
            </tr>
            <tr>
                <td>Password</td>
                <td>:</td>
                <td><input name="password" type="text" id="password"></td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>&nbsp;</td>
                <td><input type="submit" name="Submit" value="Login"></td>
            </tr>
        </table>
   </td>
</form>

提交事件挂钩 - Index.php

$( document ).ready(function() {                
    $.post("login.php", function(data) { // retrieve login form from other page.
        $("#page5").html(data); 
        $('#loginform').submit(function () {
            event.preventDefault();
            var formData = $(this).serialize();

            console.log("Form Data: " + formData); // this is not blank

            $.post("checklogin.php", formData, function(data) {
                // post-login actions
            })

            });
        });
    })
});

checklogin.php（暂时直到问题解决）

<?php
    print_r($_POST);
?>

正如我所说，即使是直接输入（例如“username=test$password=blah”而不是“formData”）也会导致空的 $_POST 数组。我也尝试过使用 ajax 等效的 post call，但没有成功。

JavaScript 控制台输出

// console.log line above $.post
Form Data: username=test&password=blah

// Result from PHP print_r
Array
(
)

Answer 1

使用.on()

由于元素是动态添加的，你不能直接将事件绑定到它们。所以你必须使用Event Delegation。

$(document).on('submit','#loginform',function () { //code here }

或更好的使用

$('#page5').on('submit','#loginform',function () { //code here }

语法

$( elements ).on( events, selector, data, handler );