Question

我正在建立一个评论系统，我使用ajax添加和显示评论而不刷新页面，但是添加评论的代码对我不起作用，并且我看不到任何错误，单击按钮后什么都没有改变，您能告诉我怎么了吗？

我试图将$（'＃comment_form'）。on（'submit'，function（event）{更改为$（document）.on（'click'，'submit'，function（）{变化，但相同。

这是我的代码： -主页

<div class="col-md-6">
    <h3>Add a comment</h3>

 <form action="" class="form-inline" id="comment_form" method="POST">

  <div class="form-group">
     <textarea name="commentaire" id="commentaire" cols="60" rows="10" 
     class="form-control"></textarea>
        </div>
        <div class="form-group">
            <input type="submit" class="btn btn-primary" value="ENVOYER" 
id="submit" name="submit">
        </div>
    </form>
<span id="comment_message"></span>
</div>

<script>
$(document).ready(function(){
$('#comment_form').on('submit', function(event){
event.preventDefault();
var form_data = $(this).serialize();
var id = <?php echo $id; ?>;
$.ajax({
url:"add_comment.php",
method:"POST",
data:{form_data,id}, 
dataType:"JSON",
success:function(data)
{
if(data.error != '')
{
 $('#comment_form')[0].reset();
 $('#comment_message').html(data.error);
 load_comment();
}
}
})
});
</script> ```

-add_comment.php页面：

<?php
require_once("../Ressources/Config.php");



$error = '';
$comment_content = '';
$id_user=$_SESSION['id_user'];
$id_produit=$_GET['id'];

if(empty($_POST["commentaire"]))
{
 $error .= '<p class="text-danger">Comment is required</p>';}
else
{
$comment_content = $_POST["commentaire"];
}

if($error == '')
{
$query =query(" INSERT INTO commentaires (id_produit, id_user, com, 
date_a) 
VALUES ($id_produit, $id_user, $comment_content, curdate()) ");
confirm($query);


$data = array(
'error'  => $error
);

echo json_encode($data);

?>

Answer 1

您可以尝试使用XMLHTTP AJAX而不是jQuery ...

基本上，您的JavaScript会像这样：

function createRequestObject() {
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
    ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
    ro = new XMLHttpRequest();
}
return ro;
}

 var http = createRequestObject();

function sndReq(action) {
http.open('get', 'rpc.php?action='+action+'&arg='+document.getElementByID('commentaire').value);
http.onreadystatechange = handleResponse;
http.send(null);
}

function handleResponse() {
if(http.readyState == 4){
    var response = http.responseText;
    var update = new Array();

    if(response.indexOf('|' != -1)) {
        update = response.split('|');
        document.getElementById(update[0]).innerHTML = update[1];
    }
 }
}

您可以通过创建“按钮”（也称为链接）来使用它...

 <a class = "button" href="javascript:sndReq('foo')">Send Chat</a>

...并设置其样式以使其看起来像一个按钮。

.button {
font: bold 11px Arial;
text-decoration: none;
background-color: #EEEEEE;
color: #333333;
padding: 2px 6px 2px 6px;
border-top: 1px solid #CCCCCC;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
border-left: 1px solid #CCCCCC;
}

然后，要在您的php文件中获取评论，只需执行以下操作：

switch($_REQUEST['action']) {
case 'foo':
 $arg = $_REQUEST["arg"];
  /* do something with $arg (aka. the comment) */
  echo "foo|$arg";
  break;
}

并在聊天中显示它，只需创建一个id为foo的div。

<div id="foo">
</div>

单击我的按钮时，Ajax代码不起作用

1 个答案: