node.js - 如何让 window.onload 函数在 Jade 模板语言中工作

Question

我是 Jade 和 NodeJS Express 的新手。我有一个简单的网页，它加载带有 div 标签的 jpeg。我希望能够使用以下 html 和 JS 获得响应式图像映射，但无法使其工作。

<div style="width:100%;">
<img id="img_ID" src="http://pindragon.social/images/landing.jpeg" usemap="#map" border="0" width="100%" alt="" />

window.onload = function () {
var ImageMap = function (map, img) {
        var n,
            areas = map.getElementsByTagName('area'),
            len = areas.length,
            coords = [],
            previousWidth = 128;
        for (n = 0; n < len; n++) {
            coords[n] = areas[n].coords.split(',');
        }
        this.resize = function () {
            var n, m, clen,
                x = img.offsetWidth / previousWidth;
            for (n = 0; n < len; n++) {
                clen = coords[n].length;
                for (m = 0; m < clen; m++) {
                    coords[n][m] *= x;
                }
                areas[n].coords = coords[n].join(',');
            }
            previousWidth = document.body.clientWidth;
            return true;
        };
        window.onresize = this.resize;
    },
    imageMap = new ImageMap(document.getElementById('map_ID'), document.getElementById('img_ID'));
imageMap.resize();
return;

}

Answer 1

请注意，“脚本”之前不允许有空格。 使用空格或制表符，但不能同时使用两者。杰德/哈巴狗对此非常挑剔。 我不打算在这里发布代码，因为它使用制表符并且不格式化。

放置“脚本”。在layout.jade中'head'后面的行上，并在其后面使用空格或制表符正确缩进的window.onload JS。

将html作为jade标签放置在index.jade中