AJAX/PHP没有工作

Question

所以我想提交一些数据（从表单）到服务器数据库使用AJAX，但由于某种原因，它接缝，AJAX脚本根本不工作。当我提交表单时，PHP脚本执行没有问题。我到处寻找答案，但迄今为止没有任何工作。这可能是愚蠢的，但我需要一些帮助。

的Jquery/AJAX脚本：

$(document).ready(function() { 
$('#InputForm').submit(function(){ 

    var that = $(this), 
     url = that.attr('action'), 
     type = that.attr('method'), 
     data = {}; 


    that.find('[name]').each(function(index, value){ 
     var that = $(this), 
      name = that.attr('name'), 
      value = that.val(); 

     data[name] = value;  
    }); 

    $.ajax({ 
     url: url, 
     async: true, 
     type: type, 
     data: data, 
     success: function(response){ 
      $(#Suc_Sub).fadeIn(800); 
     } 
    }); 
    return false; 
}); 

}）;

PHP和HTML脚本：

$url = ""; 
$email = ""; 
$comment = ""; 
$stage = ""; 

$url_error = ""; 
$email_error = ""; 
$comment_error = ""; 



if(!empty($_POST['websiteURL'])) 
{ 
    $url = $_POST['websiteURL']; 
    $regex = "/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i"; 
    if (!preg_match($regex, $url)) 
    { 
     $url_error = "Invalid Url"; 
    } 
} 
else 
{ 
    $url_error = "Url is blank"; 
} 



if(!empty($_POST['userEmail'])) 
{   
    $email = $_POST['userEmail']; 
    $email = fix_input($email); 
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) 
    { 
     $email_error = "Invalid email"; 
    } 
} 
else 
{ 
    $email_error = "Email is blank"; 
} 


if(!empty($_POST['userComment'])) 
{ 
    $comment = $_POST['userComment']; 
    $comment = fix_input($comment); 
    $regex = "/^[A-Za-z0-9 _]*[A-Za-z0-9][A-Za-z0-9 _]*$/"; 
    if (!preg_match($regex, $comment)) 
    { 
     $comment_error = "Invalid Comment"; 
    } 
} 
else 
{ 
    $comment_error = "Comment is blank"; 
} 


$stage = $_POST['websiteStage']; 


if(empty($email_error) && empty($url_error) && empty($comment_error)) 
{ 
    $date_parts = getdate(date("U")); 
    $post_date = "$date_parts[mday]-$date_parts[mon]-$date_parts[year] - $date_parts[hours]:$date_parts[minutes]:$date_parts[seconds]"; 
    mysqli_query($con,"INSERT INTO submit (URL,EMAIL,COMMENT,STAGE,Date) 
    VALUES ('$url','$email','$comment','$stage','$post_date')"); 
    die(); 
} 
else 
{ 
    die(); 
} 


<form method="post" id="InputForm" action="..\Scripts\sbt.php"> 
      <fieldset style="border:none"> 
       <ul style="list-style-type: none;"> 
        <li> 
         <label for="websiteURL"> <img src="..\Images\blank tick.png" id="Website_Image" height="50" width="60"> </label> <!--Dont forget about the label pics--> 
         <input size="25" autocomplete="off" title="Type your URL" type="url" id="websiteURL_Box" class="TextInput" name="websiteURL" required="required" placeholder="Your Website URL..." autofocus="autofocus" maxlength="100"/> 
         <div id="flyout_hidden_url" hidden></div> 
        </li><br> 

        <li> 
         <label for="userEmail"> <img src="..\Images\blank tick.png" id="Email_Image" height="50" width="60"> </label> <!--Dont forget about the label pics--> 
         <input size="25" autocomplete="off" title="Your Email plz" type="email" id="userEmail_Box" class="TextInput" name="userEmail" required="required"required="required" placeholder="Your Email..." autofocus="autofocus" maxlength="100"/> 
         <div id="flyout_hidden_email" hidden></div> 
        </li><br> 

        <li> 
         <label for="userComment"> <img src="..\Images\blank tick.png" id="Comment_Image" height="50" width="60"> </label> <!--Dont forget about the label pics--> 
         <input size="25" autocomplete="off" title="Your Comment" type="text" id="userComment_Box" class="TextInput" name="userComment" placeholder="Any comments...?" autofocus="autofocus" maxlength="100"/> 
         <div id="flyout_hidden_comment" hidden></div> 
        </li><br> 

        <li> 
         <label for="websiteStage"> </label> 
         <select name="websiteStage" class="custom"> 
          <option value="Alpha">Alpha Version</option> 
          <option value="Beta">Beta Version</option> 
          <option value="Finished">Finished</option> 
         </select> 
        </li><br> 

        <li> 
         <label id="botTest_Label" for="botQuestion">I am not a cyborg!</label> <!--Dont forget about the label pics--> 
         <input type="checkbox" required="required" value="botQ" id="botTest_Box" title="For Bot testing!"> 
        </li><br> 
        <input id="SubmitButton" type="submit" disabled value="Submit"> 
       </ul> 
      </fieldset> 
     </form> 

任何形式的帮助表示赞赏。非常感谢。

Answer 1

请改变Ajax的调用到以下几点：

$.ajax({ 
    url: url, 
    method: type, 
    data: data 
}).done(function(){ 
    $('#Suc_Sub').fadeIn(800); 
}).fail(function(){ 
    alert('fail!'); 
}); 

重要：

• 使用引号'#Suc_Sub'（由@adeneo评论）。我认为实际上有一些这个ID的元素？

其他说明：

• 的async paremeter是true默认。

• type参数是method的旧别名。

• 使用委托函数有助于更好地理解发生了什么。如果响应的状态不是200 OK（例如404 Not Found，因为未找到该脚本），您仍然会看到该事件被触发。

Answer 2

看起来这是您的jQuery不正确：

$(#Suc_Sub).fadeIn(800); 

应该

$('#Suc_Sub').fadeIn(800); 

OR

$("#Suc_Sub").fadeIn(800); 

如果这不是问题。我将开始在console.log中输出一些特定值，并在控制台中查看是否需要在ajax调用中使用这些值。如果AJAX调用失败，你会得到一个警告

var formvalues = $.ajax({ 
    url: url, 
    async: true, 
    type: type, 
    data: data, 
}); 

formvalues.done(function(data) { 
     console.log('success =' + data); 
});       

formvalues.fail(function(ts) {   
    alert(ts.responseText); 
    }); 

，然后你也将得到一个线索是什么您的问题：

console.log('url =' + url); 
console.log('type = ' + type); 
console.log(data); 

$.ajax({ 
     url: url, 
     async: true, 
     type: type, 
     data: data, 
     success: function(response){ 
      $(#Suc_Sub).fadeIn(800); 
     } 
    }); 

如果一切“正常”我会重写你的代码，因为这是关于。