1

最近开始学习 AJAX,我正在尝试创建一个评论部分,如前所述。youtube,无需刷新页面即可加载提交的评论。这是我到目前为止所得到的:

HTML:

<head><script src="JS/AJAX.js"></script>
<body>
  <form method="post" action="">
    User: <input type="text" id="name" /><br>
    Comment:<br>
    <textarea rows="5" cols="50" wrap="on" id="comment></textarea><br>
    <button id="submit">Submit</button>
  </form>

  <h3>Comments go here:</h3>
  <div id="commentarea"></div>
</body>

我不知道如何在不刷新页面的情况下将评论插入数据库。如果我使用比方说 insert.php(将字段中的数据插入数据库)作为它将刷新页面的操作。

JS/AJAX(现在使用 XMLHttpRequest(); 不包括 try 和 catch 块来找出浏览器):

function ajaxFunction(){
  var ajaxRequest = new XMLHttpRequest();

  ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
      document.getElementById("commentarea").innerHTML = ajaxRequest.responseText;
      }
  }
  ajaxRequest.open("GET","fetch-data.php",true);
  ajaxRequest.send(null);
}

PHP(获取数据.php):

<?php
$con = mysql_connect("localhost","root","") or die(mysql_error());

$mysql_select_db('localh',$con);

$query = mysql_query("SELECT User, UserComment FROM content");
if(!$query){
  die(mysql_error());
}

while($row = mysql_fetch_array($query)){
  echo "<h3>".$row['User']."</h3>"."<br>";
  echo "<p>".$row['UserComment']."</p>";
}

mysql_free_result($query);
mysql_close($con);
?>

单独加载或使用“包含”显示提取过程有效。

据我了解,在我按下提交后,它应该将评论和用户插入数据库。然后 ajax 应该使用 fetch-data 脚本来提取数据,然后将其添加到 id 为“commentarea”的 div 中。我无法弄清楚这将如何工作,更确切地说,我无法从表单中调用 ajax 函数。

4

1 回答 1

1

您可以以 action="..." 属性的形式调用 javascript 函数。如果该函数返回 false,则不会通过通常的 post 请求提交表单,但您可以将输入数据用于 ajax 请求。

于 2012-11-18T13:17:32.387 回答