Question

我正在尝试使用AJAX和JQuery重构我的代码，并且在第一道障碍时已经失败了！

基本上我正在做的是一个博客，最初我添加了一个评论部分，通过在添加新评论时重定向到'show'页面。这没关系，但我真的想使用AJAX和JQuery将它重构成一个1页的进程，特别是因为我现在想要添加一个编辑注释的函数，我不希望将用户重定向到另一个表单。

这是添加新评论的表单代码：

<% if(currentUser){ %>
<div class = "container form">
   <form action = "/blogs/<%= blog._id %>/comments" method = "POST"nid="newComment">
    <div class="row">
        <div class="col-md-2">
            <img class="newComment-ico" src = "<%=currentUser.image%>">
        </div>
        <div class="col-md-10">
            <label for="comment">Add comment</label>
        </div>
    </div>
        <textarea class = "form-control" rows="4" placeholder = "Type comment here..." name = "comment[text]"></textarea>
        <button class = "btn btn-lg btn-primary btn-block">Submit</button>
    </form>
</div>

<% } %>

这是我的POST路线：

router.post("/", middleware.isLoggedIn, function(req, res){
// lookup blog using id
Blog.findById(req.params.id, function(err, blog){
    if(err) {
        console.log(err);
        res.redirect("/blogs");
    } else {
        // create new comment
        Comment.create(req.body.comment, function(err, comment){
            if(err) {
                req.flash("error", "Something went wrong");
                console.log(err);
            } else {
                if(req.xhr){
                    res.json(comment);
                } else {
                }
                comment.author.id = req.user._id;
                comment.author.username = req.user.username;
                comment.author.image = req.user.image;
                comment.save();
                // connect new comment to campground
                blog.comments.push(comment);
                blog.save();
                // redirect to campground show page
                req.flash("success", "Successfully added comment");
                res.redirect("/blogs/" + blog._id);
            }
        });
    }
});
});

这是我的AJAX代码：

$('#newComment').submit(function(e){
e.preventDefault();
var formData = $(this).serialize();
$.post("/", formData, function(data){
   console.log(data);
});
});

当我深入研究试图运行代码的Chrom开发工具时，我得到的是以下错误：

                // Do send the request (this may raise an exception)
                xhr.send( options.hasContent && options.data || null );
            } catch ( e ) {

我已经尝试过从其他用户的问题中解决这个问题但是因为我刚开始学习AJAX而且我已经陷入了第一道障碍，很多对我来说没有意义！

这是运行代码时的chrome日志：

https://bootcamp-dvbage.c9users.io/无法加载资源：服务器响应状态为404（未找到）

发出AJAX POST请求时出错（xhr.send（options.hasContent＆amp;＆amp; options.data || null））

0 个答案: