在jade中使用javascript添加图像

Question

我有以下layout.jade代码，我想对javascript进行一些更改，以便每次重新加载页面时都可以向页面加载一些图像。 我想用玉做。 这是我目前拥有的代码：

html
  head
    title= title
    script(src='/libs/jquery/jquery.min.js')
    link(rel='stylesheet', href='/libs/bootstrap/css/bootstrap.min.css')
    link(rel='stylesheet', href='/stylesheets/style.css')

  body
      script(type='text/javascript').
       if (document.cookie.indexOf('mycookie')==-1) {
        document.cookie = 'mycookie=1';
       }
       else {
        alert('You refreshed!');
       }
    block content

它可以很好地进行刷新，并给我警报。 我有10张图像，我想将它们循环添加到页面中，以便每次刷新页面时都加载下一张图像，然后在最后一张图像之后转到第一张图像。 我可以尝试使用for循环而不是警报消息来加载图像，但是当我尝试在else语句中使用玉的标准方式添加图像时，则未显示图像。

我尝试创建一个reload.js页面，然后在应用程序中调用它，依此类推。

谁能帮我从图像文件夹中获取图像？

  img(border="0" src="images/3.jpg")

通过对此进行更改。 我想看看是否重新加载了页面，然后加载了其他图像。

谢谢

Answer 1

可能有多种方法可以做到这一点。 这是一个：您可以在服务器端使用会话 （与客户端JS中的cookie相比，IMO更好地使用IMO）来创建一个变量，该变量保存所需的图像（基于该变量）并将其传递给jade用该图像编译HTML。

像这样：

服务器

app.get('/', function(req, res){
    // incrementation logic
    if(!req.session.myimage)
        req.session.myimage = 0;
    req.session.myimage++;
    if(req.session.myimage > 10)
        req.session.myimage = 1;

    // pass it onto Jade
    res.locals.myimage = req.session.myimage;

    res.render('index');
});

玉

img(border="0" src="images/#{myimage}.jpg")