2

私は一生、ここで何が起こっているのか理解できません。別のブラウザーを開いて、変更内容が機能するかどうかを確認します。他のブラウザーが何かをキャッシュした可能性がありますが、機能します! しかし、私はそれをもう一度やりますが、そうではないようです。私はおかしくなりそうだ。

私の Web サイト syllableapp.com で、接続できる MySQL データベースを作成しました。それに接続する PHP スクリプトを作成し、単純なエントリを追加して完了です。という名前で、ここregister_email.phpからアクセスできます。その URL から手動でアクセスすると、エントリが追加されます。そのコードは次のとおりです。

<?php
    $db = new mysqli("localhost", "username", "password", "table");

    if ($db->connect_error) {
        echo "Could not connect to database.";
        exit;
    }
    else {
        $db->query("INSERT INTO emails (email) VALUES ('weird')");
        echo 1;
    }
?>

チェックすると追加されます。

ただし、フォームから追加したい。http://syllableapp.com/test/index.htmlに次のようなHTML ファイルがあります。

<html>
    <head>
        <title>Syllable - iPhone Speed Reader</title>

        <link rel="stylesheet" href="styles/style.css">

        <script type="text/javascript" src="scripts/jquery-1.8.1.min.js"></script>
        <script type="text/javascript" src="scripts/scripts.js"></script>
        <script type="text/javascript" src="scripts/jquery-ui-1.8.23.min.js"></script>
    </head>
    <body>
        <div class="content">
            <img src="images/app-icon.png" alt="App icon">

            <h1>Syllable</h1>
            <p>Speed reading app for iPhone. Devour all your Instapaper and Pocket articles, and learn to read much faster in the process.</p>

            <form method="post" action="">
                <input type="email" class="email" placeholder="Email me when it's live">
                <input type="submit" class="submit" value="Send">
            </form>

            <a href="http://twitter.com/syllableapp"></a>
        </div>
    </body>
</html>

そのため、ユーザーがフォームを送信すると、上部にあるリンク先の JavaScript ファイルが送信ボタンの押下をインターセプトし、AJAX 関数を呼び出してそれを PHP フォームに送信します。そのための jQuery は次のようになります。

$(document).ready(function() {
    $('input[type="submit"]').click(function() {
        var email = $.trim($('.email').val());
        var emailRegEx = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;


        if (email == "" || !emailRegEx.test(email)) {
            event.preventDefault();
            $(this).effect("shake", { times:2 }, 75);
        }
        else {
            $.ajax({
                type: "POST",
                url: "http://syllableapp.com/test/register_email.php",
                data: { "message": "hi" },
                success: function(data) {
                    alert("success");
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    alert("failure");
                }
            });

        }
    });
});

これは基本的に、それが有効な電子メール アドレスかどうかをチェックするだけで、有効な場合は PHP ファイルを呼び出します。

ただし、送信をクリックするたびに失敗と表示されます。なぜこれが起こっているのですか?直接アクセスできるのに、AJAX を使用できないのはなぜですか?

4

2 に答える 2