我想知道如何在node.js中使用ajax
我现在有这个.
我如何在我的内部显示例如order [0] .name和order [1] .name
当我按下名为Press的按钮时,div id =“champ”.
我现在有这个.
我如何在我的内部显示例如order [0] .name和order [1] .name
当我按下名为Press的按钮时,div id =“champ”.
@H_502_9@
app.js@H_502_9@
@H_502_9@
var express = require("express");
var app = express();
app.use(express.static("public"));
app.set("view engine","ejs");
var order = [
{
id: 1,name: "James",drink: "Coffee"
},{
id: 2,name: "John",drink: "Latte"
}
];
app.get("/",function (req,res) {
res.render("home",{order: order});
});
home.ejs@H_502_9@
@H_502_9@
<!DOCTYPE html>
<html>
<head>
<title>
AJAX calls
</title>
</head>
<body>
<h1>Ajax</h1>
<% for (var i = 0; i< order.length; i++) { %>
<div id="champ">
</div>
<% } %>
<button>Press</button>
<script src="https://code.jquery.com/jquery-3.1.1.js" integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA=" crossorigin="anonymous"></script>
<script type="text/javascript" src="javascripts/script.js"></script>
</body>
</html>
的script.js@H_502_9@
@H_502_9@
$(function() {
$("button").on("click",function () {
$.ajax({
type: 'GET',url: '/',success: function(result) {
$('#champ').html(result);
}
});
})
});
解决方法
你的ajax调用将返回home.ejs中的所有内容.我已经快速完成了一段时间,但我认为render方法将呈现你的.ejs模板.当您进行ajax调用时,您的整个模板将被置于$(‘#champ’)选择器中.此外,$(‘#champ’)选择器将匹配每个div,但您在该元素上使用id,并且id是为单个项目保留的.
@H_502_9@
当您向“/”发出GET请求时,您已经拥有订单数据.所以你可以在服务器上构建div：@H_502_9@
@H_502_9@
<% for (var i = 0; i< order.length; i++) { %>
<div id="champ">
<span><%= order[i].id %></span>
<span><%= order[i].name %></span>
<span><%= order[i].drink %></span>
</div>
<% } %>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
