Ajax调用提交刷新页面

Question

问题

我的页面似乎默认为我的PHP代码而不是通过ajax异步处理。截至目前，我的页面只是重新加载为空白屏幕，输入数组已成功传递给PHP，这很令人欣慰，但我似乎只是对ajax做错了。

我尝试了什么

在查看this link和this link后，我似乎无法理解这一点。

现时

这是HTML：

    <form class="cmxform" id="commentForm" method="" action="">
  <fieldset>
    <legend>Please provide your name, email address (won't be published) and a comment</legend>

    <p>
      <label for="spinner">How much do you love science? (optional)</label>
      <input id="spinner" name="spinner">    
    </p>

    <p>
      <label for="cname">Name (required, at least 2 characters)</label>
      <input id="cname" name="name" minlength="2" type="text" required>
    </p>
    <p>
      <label for="cemail">E-Mail (required)</label>
      <input id="cemail" type="email" name="email" required>
    </p>
    <p>
      <label for="curl">URL (optional)</label>
      <input id="curl" type="url" name="url">
    </p>
      <p>
      <label for="aoi">Area of Interest (optional)</label>
      <input id="aoi" type="text" name="aoi">
    </p>
      <p>
      <label for="currprobs">Current Problems (optional)</label>
      <input id="currprobs" type="text" name="currprobs">
    </p>
    <p>
      <label for="ccomment">Your comment (required)</label>
      <textarea id="ccomment" name="comment" required></textarea>
    </p>
    <p>
      <input id="launch" type="submit" value="Submit">
    </p>
  </fieldset>
</form>
    <div id="results"></div>

这是javascript：

    $(document).ready(function(){

    $("#commentForm").submit(function(event){

        /*
        var formData = {
            'name'              : $('input[name=name]').val(),
            'email'             : $('input[name=email]').val(),
        };
        */
        alert("SUCCESS?");
    });


});

用于验证用户后返回div的PHP代码：

<?php 

$username = isset($_POST['name'])? trim($_POST['name']):'';
$email= isset($_POST['email'])? trim($_POST['email']):'';

echo '<div id=dynamicDiv>
    <p>Hello, '.$username.'!</p>
    <p>We look forward to contacting you at, '.$email.'</p>
 </div>';
?> 

反馈

任何想法都受到赞赏，甚至是智力对话。代码片段是想法，但我很欣赏社区能够做的任何事情

编辑1

我动员了javascript和php来反映PHP和AJAX调用的知识输入和最佳实践，但问题仍然存在。

编辑2

我现在的目标是在我的javascript中使用alert（）语句，ajax将是下一步。

Answer 1

我认为问题在这里

 $("#results").html = html_i;

您尝试更改为

 $("#results").html(html_i);

在php中你应该检查姓名和电子邮件

$username = isset($_POST['name'])? trim($_POST['name']):'';
$email= isset($_POST['email'])? trim($_POST['email']):'';

Answer 2

您应该将input type =“submit”更改为input type =“button”并在onclick函数上调用Ajax，它解决您的问题，因为提交按钮提交表单和Ajax调用挂起未达到400状态。