Question

我尝试在网上关注使用ajax添加到mysql数据库的几个例子，但它没有发布到数据库，而是在页面底部执行标题。

这是您输入信息的html文档

编辑：感谢您的所有答案，现已修复。

<!DOCTYPE HTML>
    <html>
    <head>
        <script type="text/javascript" src="message.js"></script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="style.css">
    <title>Add a comment!</title>
    </head>
     <body id="bodymain">
        <a href="home.php">Home</a>
        <br>

        <div id="main">
            <?=$blog_post_history?>
            </div>
            <br>
            <br>

             <form method="post" action="addreply.php">
             <input type="hidden" name="blogid" value="<?php echo $_GET['id'] ?>">
             Author:     <input type="text" name="poster" size="60">
             <br>
             Email:       <input type="text" name="email" size"60">
             <br>
             Comment: <textarea name='content' rows=10 cols=50 id='content'></textarea>

              <input type="submit" value="send" />
    </form>
    </body>
    </html>

这是javascript

$(function(){
    //Whenever the form submites, call this
    $("form").submit(function()) {
        //submit using ajax
        submitMessage();
        //prevent from submitting
        return false;
    }
};


var submitMessage = function (){
    if($("#content").val().length > 0 && $("author").val.length > 0)
    {
        //start ajax request
        $.post(
            "addreply.php"
            {
                content: $("#message").val(),
                author: $("#author").val(),
                email: $("email").val(),
                blogid: $("blogid").val()
            },


        );
    }
};

这是添加到数据库的php页面

<?php

include("connect.php"); 

    $add_comment_query = $db->prepare("
        INSERT INTO `comments`
            (`email`, `author`, `content`, `postid`)
        VALUES
            (:email, :author, :content, :postid)
    ");

    $add_message_query->execute(array(
        ':email' => $_POST['email'],
        ':author'=> $_POST['author'],
        ':content' => $_POST['content'],
        ':postid' => $_POST['blogid']
    ));

    // This calls for a '301' response code instead of '200', with a 'Location'
    // sent to tell the browser where to redirect to.
    header("Location: home.php");

?>

任何人都可以看到我出错的地方。我完全被难倒了。

Answer 1

$("author")和$("#author")应为$("#poster")。

此外，您的所有<input>元素都属于id个中间属性。所以：

<input type="text" name="poster" size="60">

应该是：

<input type="text" name="poster" id="poster" size="60">

和所有其他输入类似。

Answer 2

您的选择器不正确。

您是否尝试在浏览器中调试javascript以查看实例$("#author")的值是什么？

哈希是ID选择器，因此您需要该元素的HTML具有id属性：

 <input type="text" name="poster" id="poster" size="60">

所有其他字段都应该进行类似修改，以便您要使用的每个元素都有一个ID，每个jquery选择器的格式为“＃”。目前作者，电子邮件和博客都有错误的选择器。

制作HTML：

<!DOCTYPE HTML>
<html>
<head>
    <script type="text/javascript" src="message.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
<title>Add a comment!</title>
</head>
 <body id="bodymain">
    <a href="home.php">Home</a>
    <br>

    <div id="main">
        <?=$blog_post_history?>
        </div>
        <br>
        <br>

         <form method="post" action="addreply.php">
         <input type="hidden" id="blogid" name="blogid" value="<?php echo $_GET['id'] ?>">
         Author:     <input type="text" name="poster" id="poster" size="60">
         <br>
         Email:       <input type="text" name="email" id="email" size"60">
         <br>
         Comment: <textarea name='content' rows=10 cols=50 id='content'></textarea>

          <input type="submit" value="send" />
</form>
</body>
</html>

和你的jquery：

var submitMessage = function (){
    if($("#content").val().length > 0 && $("#poster").val.length > 0)
    {
        //start ajax request
        $.post(
            "addreply.php"
            {
                content: $("#message").val(),
                author: $("#poster").val(),
                email: $("#email").val(),
                blogid: $("#blogid").val()
            },


        );
    }
};

尝试使用AJAX添加到数据库

2 个答案: