提交ajax表单后没有出现成功消息

Question

我准备了一个由 Jquery 和 PHP 支持的 HTML 表单。表单在 PHp 中给出了正确的输出，但是当表单提交时，它没有显示成功消息并且没有让字段为空。代码如下：

   function sendContact() {
        event.preventDefault();

        var valid;
        valid = validateContact();
        if (valid) {
            jQuery.ajax({
                // input submisssion though Ajax
                url: "xxxx.php",
                data: 'userName=' + $("#userName").val() + '&userEmail=' + $("#userEmail").val() + '&subject=' + $("#subject").val() + '&content=' + $(content).val(),
                type: "POST",
                success: function (data) {
                    // Thankyou message on sucessful submission.
                    $("#mail-status").html(data);
                    $('#mail-status').show();

                    // Clear the form.
                    $('#userName').val('');
                    $('#userEmail').val('');
                    $('#content').val('');
                },
                error: function () {
                }
            });
        }
    }

    //error checking
    function validateContact() {
        var valid = true;
        $(".InputBox").css('background-color', '');
        $(".info").html('');

        if (!$("#userName").val()) {
            $("#userName-info").html("(required)");
            $("#userName").css('background-color', '#FFFFDF');
            valid = false;
        }
        if (!$("#userEmail").val()) {
            $("#userEmail-info").html("(required)");
            $("#userEmail").css('background-color', '#FFFFDF');
            valid = false;
        }
        if (!$("#userEmail").val().match(/^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/)) {
            $("#userEmail-info").html("(invalid)");
            $("#userEmail").css('background-color', '#FFFFDF');
            valid = false;
        }
        if (!$("#content").val()) {
            $("#content-info").html("(required)");
            $("#content").css('background-color', '#FFFFDF');
            valid = false;
        }

        return valid;
    }

使用的 AJAX 库是：https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript HTML 代码是：

<div id="frmContact">
<div id="mail-status" style="display: none;">Thanking you.</div>

        <label style="padding-top:20px;">Name</label><span id="userName-info" class="info"></span><br/>
        <input type="text" name="userName" id="userName" class="InputBox"><br>

        <label>Email</label><span id="userEmail-info" class="info"></span><br/>
        <input type="text" name="userEmail" id="userEmail" class="InputBox"><br/>

        <label>Content</label><span id="content-info" class="info"></span><br/>
        <textarea name="content" id="content" class="InputBox" cols="25" rows="6"></textarea><br/>

        <button name="submit" class="btnAction" onClick="sendContact();">Send</button>
</div>    

我检查了没有网站并在谷歌上搜索了正确的代码但找不到？你能找出正确的吗？

Answer 1

你的错误

XMLHttpRequest 无法加载 xxxx.php。没有“访问控制允许来源” 请求的资源上存在标头。

是说在您的配置文件中您没有任何信息说明如何处理 CORS（跨源）请求，因此您必须在您的平台上启用 CORS...请参见此处：http://enable-cors.org/server.html 并选择您的平台（Tomcat. ..阿帕奇...）

还可以在此处检查浏览器对 CORS 的支持：http://enable-cors.org/client.html