如何使用 EJS 模板引擎将变量传递给内联 javascript？
Posted
技术标签:
【中文标题】如何使用 EJS 模板引擎将变量传递给内联 javascript？【英文标题】：How do I pass a variable to inline javascript using EJS templating engine? 【发布时间】：2016-05-28 13:18:57 【问题描述】：我从 .EJS 模板中名为 items 的数组创建了一个按钮/文本的 html 列表。如何将特定项目的 id (item.id) 传递给按钮的函数，以便将正确的数据发送到我的 api？谢谢。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Menu</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript">
function print(id)
$.ajax(
url: "https://www.example.com/api/1/print",
type: "POST",
data:
"item_id": id
,
dataType: "json",
success: function (result)
alert(result);
,
error: function (xhr, ajaxOptions, thrownError)
alert(xhr.status);
alert(thrownError);
);
;
</script>
</head>
<body>
<h2>Menu</h2>
<ul>
<% for(item of items) %>
<li>
<button onclick="print(item.id)">PRINT</button>
<%= item.name %> - <%= item.id %>
</li>
<% %>
</ul>
</body>
</html>
【问题讨论】：
【参考方案1】：<button onclick="print('<%= item.id %>')">PRINT</button>
是你在我用过的每一种模板语言中的做法。查看文档后，似乎 EJS 是一样的
【讨论】：
什么不起作用？我发布的代码的输出标记是什么？ 它说“Uncaught ReferenceError: mxYbGAuc9p is not defined”，因为 html 编译为 生成的 HTML 是什么？请按照我最初发布的方式运行代码，然后发布生成的 HTML。我们需要看看 EJS 正在生产什么。将其添加为原始问题的编辑。 HTML：gist.github.com/sapanbhuta/53036968ab3612261d5f EJS：gist.github.com/sapanbhuta/ce79b4ffdaded3b1c442 是那个id吗？如果是这样，您需要额外的报价。 （我假设 id 是一个整数，我的错）。查看我的更新【参考方案2】：<button onclick="print('<%= item.id %>')">PRINT</button>
用模板标签把你的变量用单引号括起来
【讨论】：
以上是关于如何使用 EJS 模板引擎将变量传递给内联 javascript？的主要内容，如果未能解决你的问题，请参考以下文章
在作为 EJS 模板传递以查看的字符串化 JSON 中转义单引号
Express EJS模板如何传递一个json对象来查看它是不是未定义