Question

脚本应发布评论并从服务器加载答案。它适用于Firefox，但在Chrome中，我想没有触发任何事件，您可以单击按钮但不会发生任何事情。我已经在Chrome开发者工具中检查了一些错误，但没有找到任何错误。

HTML：

<div class="posted_comments" id="comments'.$post_id.'"></div>
<form method="post" id="c'.$post_id.'">
    <input class="comment_input" placeholder="Write your comment here..." name="comment" />
    <input name="post_id" id="post_id" hidden="hidden" value='.$post_id.' >
    <button class="comment_button" onclick="post_comment('.$post_id.')">Send</button>
</form>

jQuery脚本：

 function post_comment(id) {
     x = "#c" + id;
     y = "#comments" + id;
     $(x).submit(function () {
         $.ajax({
             type: 'POST',
             url: 'post_comment.php',
             data: $(x).serialize(),
             cache: false,

             success: function (data) {
                 $(y).html(data);
             },

             complete: function () {
                 $(x)[0].reset();
                 $(x).unbind();
             }
         });
         return false;
     });
 };

Answer 1

不要只是在开发人员工具中查找错误。使用Chrome调试器在代码中设置断点并查看其中的断点。

您可以在代码中添加debugger;语句，也可以在Chrome调试器的“来源”标签中打开代码，然后点击左边距设置断点。

无论哪种方式，在post_comment()函数的开头，submit()回调的开头（即$.ajax()行）设置断点，并在每个开头处设置断点success和complete回调。

然后你可以看到代码得到了多远，看看变量等等。这应该会给你一些更多的线索。

这是introduction to JavaScript debugging和more information about the Chrome DevTools。

Answer 2

我非常确定Chrome会在不执行您的功能的情况下提交表单，因此您需要阻止默认操作。

<button class="comment_button" data-id="' . $post_id . '">Send</button>

$('.comment_button').click(function(event){
   event.preventDefault();
   //put you ajax here, and get the post ID with $(this).attr('data-id');
});

Answer 3

试试这个

HTML：

<php include ('data.php');?>
    <form action="action.php" method="post">
    <label>Name:</label>
    <input name="name" type="text" placeholder="Name here"/><br>
    <label>Comment:</label>
    <textarea name="comment" type="text" placeholder="Write a comment here"/></textarea>
    <br>
    <input type="submit" name="submit" value="Send">

然后创建一个动作文件

action.php的

<?php 
$handle = fopen("data.php", "a");
if( isset( $_POST['name'] ) &&  strlen( $_POST['name'] ))
    {
fwrite($handle,"<br>");
fwrite($handle,'---------------------------------------');
fwrite($handle,"<br><b>");
fwrite($handle,$_POST["name"]);
fwrite($handle,'<br> Comment: <br>');
fwrite($handle,$_POST["comment"]);
fclose($handle); 
header("Location: ./index.php");
       }
else
     {
echo "name required <br> <a href='./index.php'>OK</a>";
      }
exit;
?>

如果代码不起作用，您需要编辑一些代码

Answer 4

根据：

<div class="posted_comments" id="comments'.$post_id.'"></div>
<form method="post" id="c'.$post_id.'">

和

x = "#c" + id;
y = "#comments" + id;

如果你这样称呼：

post_comment('.$post_id.')

然后你的变量将是：

x = "#c.$post_id.";
y = "#comments.$post_id.";

在这种情况下，您的ID错误，您有额外的单引号。

jQuery脚本在Firefox中运行，在Chrome中停止

4 个答案: