Question

我正在处理的页面工作正常，直到我添加了AJAX。现在，该页面甚至无法加载。我得到了＆＃34; Aw snap！尝试加载此页面时出现问题＆＃34; Chrome提供的消息。这些文件位于服务器上。我无法提升开发人员工具，因为它甚至无法加载。但它会加载到Internet Explorer中。有没有人看到任何会导致无法加载的东西？我之前从未遇到过这个问题。

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
<head>
    <title></title>
    <meta charset="UTF-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style>
.block {
    display: block;
    margin: 25px 10px;
}
#text-success {
    display: none;
    color: red;
}
</style>    
</head>
<body>  
<form action="" method="POST">
    <input type="number" placeholder="Phone Number" class="block" id="number">
    <select class="block" id="carrier">
        <option>Verizon</option>
        <option>Virgin Mobile</option>
        <option>Alltel</option>
        <option>AT&T</option>
        <option>Boost Mobile</option>
        <option>Republic Wireless</option>
        <option>Sprint</option>
        <option>T-Mobile</option>
        <option>U.S. Cellular</option>
    </select>
    <textarea placeholder="Your Message" class="block" id="message"></textarea>
    <input type="submit" value="Send Text" id="submit-text">
    <p id="text-successful">Your Message Sent Successfully!</p>
</form>
<script>
jQuery(document).ready(function() {
$("#submit-text").on("click", function(event) {

    var number = $("#number").val();
    var carrier = $("#carrier").val();
    var message = $("#message").val();
});
$.ajax({
    url: "text-send.php",
    type: "POST",
    data: {
        "number": number,
        "carrier": carrier,
        "message": message
},
success: function(data) {
    //console.log(data); // data object will return the response when status code is 200
    if (data == "Error!") {
    alert("Unable to send email!");
    alert(data);
    } else {
        $(".project-container").addClass("removeClass");
        $("#text-success").show();
        $(".light-gray-container").hide();
    }
},
complete: function() {
    $('body, html').animate({
        scrollTop: $('.email-success').offset().top
    }, 'slow');
},
error: function(xhr, textStatus, errorThrown) {
    alert(textStatus + "|" + errorThrown);
    //console.log("error"); //otherwise error if status code is other than 200.
}
});
});
</script>
</body>
</html>

Answer 1

我想你想点击按钮进行ajax调用。

此外，由于输入按钮类型=＆＃34;提交＆＃34;您需要使用add $t1, $t2, $t3 # loads value of $t2 + value of $t3 into $t1，因此请停止默认行为＆amp;做一个ajax电话。否则，您可以将类型event.preventDefault()更改为键入submit

此外，ajax位于click功能之外。也许这就是为什么页面没有加载的主要原因。由于它在button之外，它会在文档准备好后立即尝试进行ajax调用

click

页面未在Chrome中加载

1 个答案: