2

単純なフォーム データをインデックス ページから PHP 関数 checklogin.php に送信しようとしています。私が見つけたのは、シリアル化されたデータや直接入力でさえ、PHP関数に到達していないということです。jQuery 関数が呼び出されているという事実はわかっています。また、さまざまな事後処理を行っているため、PHP ファイルが呼び出されていることもわかっています。

$_POST データを使用してフォームから直接データを送信すると、action="checklogin.php"データが正しく受信され、処理できます。ただし、jQuery を使用してフォームの送信をインターセプトすると、データは受信されません。

注意すべきことの 1 つは、実際のログイン フォーム HTML が別のページから挿入されることです。これにより、1 つの大きなインデックス ファイルではなく、複数のページで作業できるようになります。

フォーム - 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);
?>

私が言ったように、「formData」の代わりに「username=test$password=blah」などの直接入力でも、空の $_POST 配列になります。また、運が悪いと同等の ajax post 呼び出しを使用してみました。

JavaScript コンソール出力

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

// Result from PHP print_r
Array
(
)
4

1 に答える 1

1

.on()を使用する

要素は動的に追加されるため、イベントをそれらに直接バインドすることはできません。そのため、 Event Delegationを使用する必要があります。

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

またはより良い使用

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

構文

$( elements ).on( events, selector, data, handler );
于 2013-11-07T07:24:53.020 に答える