在jade中使用JavaScript添加圖像

我有以下的layout.jade代碼，我想對javascript進行一些更改，以便每次頁面重新加載時都可以將一些圖像加載到頁面。我想用玉做這個。這裏是我目前的代碼：在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")

。我想看看頁面是否重新加載，然後加載不同的圖像。

謝謝

來源

2014-10-27 user1832681

你想用邏輯或代碼幫助嗎？ – laggingreflex 2014-10-27 06:06:15

如果可能，最有可能的代碼和邏輯。 – user1832681 2014-10-27 22:16:41

可能有很多方法可以做到這一點。這裏有一個：你可以在服務器端使用sessions（IMO最好使用客戶端JS中的cookie）來創建一個變量來保存你想要的圖像（基於變量），並將它傳遞給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")

來源

2014-10-28 08:09:40 laggingreflex

在jade中使用JavaScript添加圖像

回答

相關問題