反馈表单jQuery不返回任何数据 - Feedback Form jQuery returns no data

我有一个html页面，其中包含对php文件的ajax查询。这个php文件应该发送一条消息，然后提供对ajax查询的响应。然而，无论我做什么，我都无法从这个ajax调用中得到任何响应。我做错了什么？

HTML:

<form id="feedback-form" method="post">
<table border="0" cellpadding="3">
<tr>
<td><h4>Name: </h4></td>
<td><input type="text" id="name"></input></td>
</tr>
<tr>
<td><h4>Company: </h4></td>
<td><input type="text" id="company_name"></input></td>
</tr>
<tr>
<td><h4>Email: </h4></td>
<td><input type="text" id="email"></input></td>
</tr>
<tr>
<td><h4>Feedback Category: </h4></td>
<td>
<select id="category">
<option class="placeholder" selected disabled>Select Category</option>
<option value="website">Site Issue</option>
<option value="content">Content Issue</option>
<option value="suggestion">Content Suggestion</option>
</select>
</td>
</tr>
<tr>
<td><h4>Message: </h4>(include as much detail as possible)</td>
<td><textarea id="message" style="resize: none;" rows="5"></textarea></td>
</tr>
<tr>
<td><h4>Attachment: </h4>(include any material relevant to your request)</td>
<td><input type="file" id="files" multiple></input></td>
</tr>
<tr>
<td><input type="submit" value="Send"></input></td>
</tr>
</table>
</form>
<span id="feedbackResponse"></span>

JS:

$('#feedback-form').on('submit', function (e) {
          e.preventDefault();
          $.ajax({
            type: 'POST',
            url: '/RK/sendFeedback.php',
            data: $('#feedback-form').serialize(),
            success: function (response) {
              $('#feedbackResponse').html(response);
        },
            error: function (response) {
              $('#feedbackResponse').html(response);
            }
          });
        });

PHP:

<?php
require '/RK/PHPMailerAutoload.php';
$mail = new PHPMailer;
$mail->isSMTP();                                      // Set mailer to use SMTP
$mail->Host = '******.100';                       // Specify main and backup server
$mail->SMTPAuth = true;                               // Enable SMTP authentication
$mail->Username = 'email@email.com';                   // SMTP username
$mail->Password = 'password';               // SMTP password
$mail->SMTPSecure = 'tls';                            // Enable encryption, 'ssl' also accepted
$mail->Port = 587;                                    //Set the SMTP port number - 587 for authenticated TLS
$mail->setFrom('email@email.com', 'DataMotion Wiki');     //Set who the message is to be sent from
$mail->addReplyTo('email@email.com', 'No Reply');  //Set an alternative reply-to address
$mail->addAddress('email@email.com', 'No Reply');  // Add a recipient
$mail->WordWrap = 50;                                 // Set word wrap to 50 characters
$mail->isHTML(true);                                  // Set email format to HTML
$mail->Subject = 'DataMotion Wiki Feedback';
$mail->Body    = '<b>From:</b> '.$_POST['email'].'<br/><b>Category:</b> .$_POST['category'].<br/><b>Message:</b> .$_POST['message']
 echo 'Just before sending';
if(!$mail->send()) {
   echo 'Message could not be sent.';
   echo 'Mailer Error: ' . $mail->ErrorInfo;
   exit;
}
echo 'Thank you for your feedback. Your message has been sent';
?>

也许，您的JS代码位于表单上方。因此，在这种情况下，您需要将其封装到就绪函数中，因为在您的JS现在不存在反馈表单。所以，您的代码正在尝试处理不存在的元素。Ready函数仅在加载DOM 后才运行内部的所有内容

所以，这可以为你工作

$(function(){
        $('#feedback-form').on('submit', function(e) {
            e.preventDefault();
            $.ajax({
                type: 'POST',
                url: 'sendFeedback.php',
                data: $('#feedback-form').serialize(),
                success: function (response) {
                    $('#feedbackResponse').html(response);
                },
                error: function (response) {
                    $('#feedbackResponse').html(response);
                }
            });
        });
    });

此外，在表单中添加method="POST"，因为GET是默认的表单方法