网页未在 Chrome 中加载

Page not loading in Chrome

本文关键字:加载 Chrome 网页      更新时间:2023-09-26

我有一个我正在处理的页面,在我添加 AJAX 之前运行良好。现在,页面甚至无法加载。我得到"哎呀!尝试加载此页面时出错"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>

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

另外,由于输入按钮类型="提交",您需要使用event.preventDefault()因此请停止默认行为并进行ajax调用。否则,您可以将类型 submit 更改为类型 button

此外,ajax 在点击功能之外。也许这就是页面无法加载的主要原因。由于它在click外部,因此一旦文档准备就绪,它将尝试进行ajax调用

jQuery(document).ready(function() {
$("#submit-text").on("click", function(event) {
    event.preventDefault(); 
    var number = $("#number").val();
    var carrier = $("#carrier").val();
    var message = $("#message").val();
 // Removed the closing braces of click function
$.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.
}
}); // Added closing braces
})
});