2014-10-27 3 views
0

У меня есть следующий код layout.jade, и я хочу внести некоторые изменения в javascript, чтобы каждый раз, когда страница была перезагружена, я могу загрузить некоторое изображение на страницу. Я хочу сделать это, используя нефрит. Вот код, который у меня есть сейчас:Добавление изображения с помощью javascript в jade

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 loop вместо предупреждающего сообщения для загрузки изображений, но когда я пытаюсь добавить изображение, используя стандартный способ jade в инструкции else, изображение не отображается.

Я попытался создать страницу reload.js, а затем вызвать ее в приложении и так далее.

Может кто-нибудь помочь мне в том, как я могу получить изображение из папки изображений, как

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

путем внесения изменений в этот. Я хочу посмотреть, перезагружена ли страница, а затем загружается другое изображение.

Thanks

+0

Вы хотите помочь с логикой или код? – laggingreflex

+0

Код, скорее всего, и логика, если это возможно. – user1832681

ответ

1

Может быть несколько способов сделать это. Вот один из них: вы можете использовать sessions на стороне сервера (с IMO лучше работать с файлами cookie на стороне клиента JS), чтобы создать переменную, которая содержит нужное изображение (на основе переменной) и передать его в 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") 
Смежные вопросы