带有 EJS 的 jQuery答案

【问题标题】：jQuery with EJS带有 EJS 的 jQuery
【发布时间】：2015-08-15 13:46:18
【问题描述】：

Jquery 不适用于 EJS，这是我的 EJS 页面。我可以看到 EJS 功能正常工作，但 jQuery 功能不工作。它没有显示任何错误。

<!DOCTYPE html>
<html>
  <head>
    <title>Help Page</title>
    <link rel='stylesheet' href='/stylesheets/style.css' />

  </head>
  <body>
    <h1>Help</h1>
    <p>This is Help Page</p>

    <h2> Member Data </h2>
    <% data.forEach(function(d){ %>

        <%= d.member_desc %>

    <% });%>

     <script type='text/javascript'>
        $(function(){
            alert('inside jquery');
        });
     </script>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
  </body>
</html>

【问题讨论】：

标签： jquery node.js express ejs

【解决方案1】：

您需要将您的 jQuery <script> 放在另一个之前。否则 $ 尚未定义。

浏览器一个接一个地加载每个脚本。假设我们有脚本 A 和 B.B 使用了 A 中的某些内容，那么 A 应该在 B 之前，否则它将不起作用。

TL;DR

改变这个：

<script type='text/javascript'>
        $(function(){
            alert('inside jquery');
        });
     </script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

到这里：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script type='text/javascript'>
            $(function(){
                alert('inside jquery');
            });
</script>

【讨论】：

【解决方案2】：

将jquery脚本放入：

$(document).ready(function(){
    ...
});

现在脚本将在所有文档加载后运行。

【讨论】：

【解决方案3】：

我知道回答这个问题有点晚了，但我只想添加这个评论，他们有（jquery 和 ejs）不同的生命周期，一个（ejs）在渲染之前编译，jquery 在渲染之后工作，你的问题有这种原因

【讨论】：