使用pug等模板引擎的用户事件？

问题描述 投票：0回答：1

我想用NodeJS、Express和Pug创建一个应用程序。这个应用应该类似于编辑器的工作，并对不同的用户事件做出反应。

现在我有一个概念性的问题。用NodeJS和模板引擎的方法是否合适？

我偶然发现如何把事件放到模板引擎中。例如在pug中，我可以嵌入Javascript，但是模板引擎似乎并不是为了实现用户事件而制作的--因为在文档中以及在Stack Overflow上，我没有找到嵌入JS脚本的 "标准解决方案"，顶多是变通办法，直接在pug中嵌入JS（而不是引用脚本）。比如这里。用jadepug渲染内联Javascript

我也尝试自己加入一个脚本。

Pug文件

doctype html
html
  head
    title= `${title}  
  body
    h1 My new App
    block content
  script(src="myscript.js").

JS脚本

window.alert("Bingo!");

Html-结果

<!DOCTYPE html>
  <html>
    <head>
      <title>Title</title>
    </head>
    <body>
       <h1>My new App</h1>
    </body>
    <script src="myscript"></script>
  </html>

代码似乎是正确的，但却无法使用。

那么我是否理解为模板引擎不是实现用户事件的正确方法？如果这是正确的，那么只用客户端的Javascript是更好的方法吗？

javascript node.js pug dom-events template-engine
1个回答
0
投票

简单来说，模板引擎是将你的数据与HTML在服务器端结合起来，然后发送到客户端（这里是浏览器）。浏览器中产生的事件可以通过javascript监听器来监听。这方面的代码可以通过tagsrc脚本嵌入到模板中。这些脚本将在浏览器加载页面后生效。一个EJS的例子。

<input type="text" id="username" oninput="myKeypressFunction()">

<p id="out"></p>

<script>
function myKeypressFunction() {

  let data = document.getElementById("username").value;

  document.getElementById("out").innerHTML = "Text: " + data;
}
</script>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.