什么是在不刷新页面且可以通过按钮事件和URL进行访问的情况下更新库存的正确方法。这样，当url param id基于路由时，它将把它更新到特定页面。就像购物网站上的产品页面一样。下面通过ajax请求而不是通过url（inventory / 2）来工作，它只是将我带到发布的数据，而不是呈现的视图。我要求它能够通过url转到特定页面，以便可以链接到该页面。当未启用javascript时，还需要能够退回到标准页面加载。
查看（库存）
extends layout
block content
div.row
div.col-md-offset-2.col-md-8#inventory
a(class='btn', href='#') Get More!
script.
$(function(){
$("a.btn").on("click", function(e) {
e.preventDefault();
$.get( '/inventory/2', function(data) {
$('#inventory').html(data);
});
});
});
路线
router.get('/inventory/:id?', function (req, res) {
if(req.params.id){
var id = req.params.id;
var data = "Updated and now on page " + id
res.send(data);
}else{
res.render('inventory');
}
});
建议使用两组不同的路径：一组用于人类用户，另一组用于脚本（API）。在routes上面的文件中，您将两者混合使用-res.send(data)用于AJAX脚本，并res.render('inventory')根据用户的请求直接在浏览器中显示-基本上，这就是为什么未获得预期结果的原因。
请在下面看到一个简单的示例，说明如何构建应用文件（合理地扩展它）：
看法：
extends layout
block content
div.row
div.col-md-offset-2.col-md-8#inventory
= content
a(class='btn', href='#') Get More!
script.
$(function(){
$("a.btn").on("click", function(e) {
e.preventDefault();
$.get( '/api/inventory/2', function(data) {
$('#inventory').html(data);
});
});
});
路线：
var getData = function(id) {
return "Updated and now on page " + id;
}
router.get('/api/inventory/:id', function (req, res) {
res.send(getData(req.params.id);
}
router.get('/inventory/:id?', function (req, res) {
var data;
if (req.params.id) {
data = getData(req.params.id);
} else {
data = null;
}
res.render('inventory', {content: data});
});
（注意：如果您包含HTML，则可能必须在Jade模板中使用!= content而不是。）= contentdata
现在，用户可以通过/inventory和来访问页面的不同状态/inventory/2，而AJAX调用将使用第三个URL来完成/api/inventory/2。
最重要的是，你可以动态更新在用户的浏览器URL字段中可能需要的-看到答案对这个问题的更多细节。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句