4

我整天都在环顾四周,无法弄清楚为什么我的$(document).ready包装器中的代码都不起作用。

布局.jade

!!!5
html
    head
        title #{title}
        link(rel='stylesheet', href='/stylesheets/style.css')
        script(src='http://code.jquery.com/jquery-1.js')
        script.
            $(document).ready(function(){
                alert("working");
                $("#message").html("message set through jquery");
            });
    body
        header
            h1 Sample message here
        .container
            .main-content
                block content
            .sidebar
                block sidebar
        footer
            block foot

登陆.jade

extends layout
block content
    p#message Landing page
    #info Info area
block foot
    a(href="https://localhost:8888/logout", title="logout") Logout

控制器:

exports.landing = function(req, res) {
    res.render('landing', {title: 'My Title'});
}

呈现的html:

<!DOCTYPE html><html><head><title>Dashboard</title><link rel="stylesheet" href="/stylesheets/style.css"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script><script>$(document).ready(function(){
    $("#message").html("message set through jquery");
});
alert("working");</script></head><body><header><h1>Sample Web App</h1></header><div class="container"><div class="main-content"><p id="message">Landing page</p><div id="info">Info area</div></div><div class="sidebar"></div></div><footer><a href="https://localhost:8888/logout" title="logout">Logout</a></footer></body></html>

控制台错误:我刚刚检查了页面上的控制台,而不是我运行 Express Web 服务器的地方,发现了一个错误:

Uncaught reference error: $ is not defined

https服务器问题:

主要问题有两个方面:1)我使用了@Joe 识别的错误网址。2)由于我的网络服务器是在 Express 中创建为 https,而不是 http,因此它拒绝使用带有 @Joe 答案中列出的非安全 http 地址的 url。相反,我需要将其修改为https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js以便我的 https Web 服务器可以使用它,正如@Frédéric Hamidi 所建议的那样。

4

3 回答 3

7

您的开发环境似乎很奇特:)

jQuery 脚本无法加载,因为它是通过 HTTP 提供的,主文档是通过 HTTPS 提供的,并且您的两个浏览器都已配置为静默丢弃从通过 HTTPS 提供的文档发出的 HTTP 请求。

幸运的是,Google CDN 支持 HTTP 和 HTTPS,因此您只需在脚本源 URL 中切换协议:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
于 2013-10-09T20:19:15.083 回答
2

见乔的评论:

“code.jquery.com/jquery-1.js”;正在抛出 404 - 你可能打算使用这个:“//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js”?– 乔 38 分钟前

这大概就是你的答案。+1 乔。

于 2013-10-09T19:44:14.920 回答
1

只需按照他们所说的更改链接即可。我改变了https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

于 2013-10-09T20:07:26.097 回答