0

私はいくつかのPHPを知っているので、ajax/jqueryを使用してそれを結合したいと思います。学習目的のためだけに、いくつかのスクリプトを作成しています。空き状況などを確認する登録フォームを作成したかったのですが、そのようなスクリプトを作成する前に、動作を確認するためだけにもっと簡単なことをしたいと思いました。

私の目標はajaxとの連絡フォームで、それは機能します。データはphp検証スクリプトに送信されます。エラーは配列に保存され、エラーのリストを返すか、メッセージを送信します。

しかし、いくつか質問があります。

  1. ブラウザがjavascriptをサポートしていない場合はどうなりますか。それでもメッセージを送信する方法はありますか?
  2. 送信により、ajaxpost関数がトリガーされます。phpファイルに行く前にjquery検証を追加する最良の方法は何ですか(クライアント側)

    AJAXフォームにお問い合わせください

    <script language="JavaScript" type="text/javascript">
        function ajax_post(){
            // Create our XMLHttpRequest object
            var hr = new XMLHttpRequest();
            // Create some variables we need to send to our PHP file
            var url = "functions/validation.php";
            var name = document.getElementById("name").value;
            var subject = document.getElementById("subject").value;
            var email = document.getElementById("email").value;
            var message = document.getElementById("message").value;
            var vars = "name="+name+"&subject="+subject+"&email="+email+"&message="+message;
            hr.open("POST", url, true);
            // Set content type header information for sending url encoded variables in the request
            hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            // Access the onreadystatechange event for the XMLHttpRequest object
            hr.onreadystatechange = function() {
                if(hr.readyState == 4 && hr.status == 200) {
                    var return_data = hr.responseText;
                    document.getElementById("status").innerHTML = return_data;
                }
            }
            // Send the data to PHP now... and wait for response to update the status div
            hr.send(vars); // Actually execute the request
            document.getElementById("status").innerHTML = "processing...";
    
        }
    </script>
    

    お問い合わせフォーム

    文章

        <label>Name
            <span id="nameInfo" class="small">Add your name</span>
        </label>
        <input type="text" name="name" id="name" />
    
        <label>subject
            <span id="subjectInfo" class="small">Add a subject</span>
        </label>
        <input type="text" name="email" id="subject" />
    
        <label>Email
            <span id="emailInfo" class="small">Add a valid email address</span>
        </label>
        <input type="text" name="email" id="email" />
    
        <label>message
            <span id="messageInfo" class="small">Your message min 20 chars</span>
        </label>
        <input type="text" name="message" id="message" />
    
        <button type="submit" onClick="javascript:ajax_post();">Send</button>
        <div class="spacer"></div>
        <div id="status"></div>
    

4

3 に答える 3

2

ブラウザが JavaScript をサポートしていない場合はどうなりますか。まだメッセージを送信する方法はありますか?

適切に作成すると、クライアントで JavaScript が使用できない場合でも、フォームは通常どおりデータを送信します。プログレッシブ エンハンスメントであり、常に JavaScript の使用方法である必要があります。

送信すると、ajax post 関数がトリガーされます。PHPファイルに行く前にjquery検証を追加する最良の方法は何ですか(クライアント側)

submitイベントを使用して、送信前にフォーム データをキャプチャします。

于 2012-09-14T00:04:41.840 に答える
0

JavaScript が利用できない場合、フォームは従来の方法で送信されます。この場合、サーバー側のコードでこれを処理し、完全な HTML ページを返す必要があります。

于 2012-09-14T00:03:46.223 に答える
0

なぜjqueryを使わないのですか?<form>タグにデータを送信させ、上記のフォームの submit() イベントで false を無効にする/返すだけです。

于 2012-09-14T00:05:01.263 に答える