Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   После события появляется элемент и остается (https://javascript.ru/forum/misc/40351-posle-sobytiya-poyavlyaetsya-ehlement-i-ostaetsya.html)

november 01.08.2013 20:38

После события появляется элемент и остается
 
Доброго времени суток. При нажатии на "кнопку" появляется div. Это у меня работает. Как сделать так, чтобы этот div оставался и дальше на сайте при переходе на другие страницы. И только после нажатия другой кнопки на другой странице он исчезал?
<script>
var show;

function look(type)
{
param=document.getElementById(type);
if(param.style.display == "none")
{
if(show) show.style.display = "none";
param.style.display = "block";
show = param;
}
else param.style.display == "none";
}
</script>


Спасибо.

bes 02.08.2013 00:35

Цитата:

Сообщение от november
При нажатии на "кнопку" появляется div. Это у меня работает. Как сделать так, чтобы этот div оставался и дальше на сайте при переходе на другие страницы. И только после нажатия другой кнопки на другой странице он исчезал?

он должен быть на других страницах, его состояние должно быть сохранено

november 02.08.2013 01:14

Угу. Должно быть :) Вот только я не пойму как.
По нажатию всплывает этот div. Так же по нажатию этой кнопки идет запись куков под именем name.
После нажатия Другой кнопки на другой странице эти куки удаляются.

Это похоже на заказ on-line. Когда вы что-то добавляет в корзину - появляется скрытая до этого надпись, например, "Ваш заказ". И пока пользователь лазает по другим страницам сайта, эта надпись висит. Но когда заказ "состоялся" - надпись пропадает - куки удаляются.

Насколько я понимаю, это делается с помощью куков? Причем имя этих куков я знаю, а вот их value постоянно меняется (но это не имеет значения для задачи). Но вот такая комбинация не работает у меня :
<?php
if (isset($_COOKIE["user"]))
  echo "Ваш заказ";
else
  echo "А если нет, ничего не показывать";
?>

cyber 02.08.2013 02:20

november,
можно через localstorage, простой пример
<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>

    <div id='add-div'>Добавить</div>
    <div id='remove-div'>Удалить</div>
    <div id='container'> </div>
    
    <script>

 
    (function () {
      
       var div, 
           body = document.body;
      
      
      check();
      
      body.onclick = function (e) {
      
       
        if(e.target.id == 'add-div')
           add();
        
        if(e.target.id == 'remove-div')
           remove();
      
      
      
      }
      
      function add() {
        
        
        
        if(div)
           return;
       
        
        localStorage.setItem('show-state', true);
        
        div = document.createElement('div');
        
        div.innerHTML = 'О, чудо я видимый:)';
        
        
        body.appendChild(div);
      
      
      }
      
      
      
      
      function remove() {
        
        localStorage.removeItem('show-state');
        
        body.removeChild(div);
        
      
      }
      
      
      
      function check() {
       
        if(localStorage.getItem('show-state')){
         
          add();
        
        }
      
      
      }
      
      
      }());   
      


    </script>

  </body>
</html>

так же данные о состояние можно хранить в БД или куках , или сделать переходы между страниц через ajax (не самый надежный вариант)

november 02.08.2013 18:26

Спасибо за ответ. Но у меня что-то не работает он :(
Скрипт ведь можно ставить в head?
Нужно подключать дополнительные библиотеки?
if (Modernizr.localstorage) {
  // window.localStorage is available!
} else {
  // нет встроенной поддержки HTML5-хранилища
}


Я делаю так. Ставлю скрипт в head. В нужно мне месте делаю так:
<div id='add-div'><a href="#" onClick="doAdd(^[$id]);  return false;;">&#10004;Галочка</a></div>

И ничего не происходит...Вообще.

cyber 02.08.2013 18:44

november,
эм , если использовать domcontentloaded или его аналог в jquery ready, или любое подобное событие в другой бибилеотеки/фреймворке, иначе не будет работать, по тому что когда загружается head, body еще нет.

bes 02.08.2013 19:35

если это действие на время сессии, то удобнее хранить на сервере в сессии, либо передавать в параметре или работать с хешем, в крайнем случае, хранить в куках или на складах


Часовой пояс GMT +3, время: 11:33.