Question

据我所知，我可以使用AJAX更新页面的一部分，而无需刷新页面。我怎样才能正确实现？

//Get Book
router.get('/form/:id', (req, res) => { 
  Book.findOne({
    _id: req.params.id
  })
    .then(books=> {
      res.send(books)
      });
    });
});

我要添加的位置，例如通过AJAX获得头衔。

     <div class="form-group">
         <b class="titleclass">Title:</b>
         <input type="text" class="form-control" name="title">
     </div>

我的尝试：

//Get Book
router.get('/form/', (req, res) => { 
  var x="this is title";
  res.send(x)
});

JS：

   $(".test").click(function () {       
        $.get("/form/", function (data, status) {
            alert(data); //does not trigger               
        })
    });

Answer 1

你可以像这样发送标题。你必须在ajax中使用return false，例如preventDefault（）。/ form / true is / form 编辑：

$(.test).click(function(){//and get title with ajax in html file
$.get("/form", function(data, status){
    alert(data)
})return false;});

router.get('/form', (req, res) => { var x="this is title"; res.send(x)});
app.use(function(req, res) {//if not requested from same server
 res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); });

Answer 2

根据jQuery文档，如果请求成功，则执行$ .get函数回调。请确保您没有处理CORS问题。如果案例将这些添加到您的回复标题中：

res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With,Content-Type, Accept");

Answer 3

所以我认为这里有一些可能的问题：

您没有在GET中传入：id参数。
您应该删除/form/。
您的回复应为res.json({books: books});。
如果未从同一服务器请求，则启用CORS。

我希望这会有所帮助。

如何用AJAX填充表单 - 使用node express

我的尝试：

3 个答案: