2016-09-27 3 views
-3

сохранить значение в javascript после загрузки страницы?

$("#divid1").click(function(){ 
 
    $("#divid1").hide(); //want this to keep hidden after refresh 
 
    $("#hideid1").hide(); //want this to keep hidden after refresh 
 
    $("#id1").show(); //want this to keep showing after refresh 
 
});
.hide{ 
 
    display:none; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img src="/img/done.png" id="divid1" alt="divid1"/> 
 
<img src="/img/schedule.png" height="12" width="12" id="hideid1" alt="hideid1" /> 
 
<div id="id1" class="hide"><img src="/img/done.png" height="12" width="12" alt="id1" /></div>

я пытаюсь показать изображение после загрузки страницы, когда OnClick(); показать новое изображение и скрыть старое изображение. но, на странице обновить его сбрасывает.

любезно дайте мне способ решить эту проблему.

Рабочий код с моими идентификаторами в нем будет оценен!

+0

'localStorage' может обеспечить решение – depperm

+0

я понятия не имею, как использовать его @depperm – monemacu

+1

http://stackoverflow.com/questions/16206322/how-to-get-js -variable-to-keep-value-after-page-ref – epascarello

ответ

0

Проверьте Example. Это должно сделать достаточно ясным.

JS

$("#divid1").click(function(){ 
    $("#divid1").hide(); //want this to keep hidden after refresh 
    $("#hideid1").hide(); //want this to keep hidden after refresh 
    $("#id1").show(); //want this to keep showing after refresh 
    localStorage.setItem('hidden', true); 
}); 

$(function() { 
    // if localStorage has hidden as true, hide the div and show other 
    if(localStorage.getItem('hidden')){ 
    $("#divid1").hide(); 
    $("#hideid1").hide(); 
    $("#id1").show(); 
    } 
}); 
+0

thanx so mch работал как шарм .. также как сбросить память .. в примере clearstorage не работает! – monemacu

+0

Без проблем, всегда приятно помочь:] Хммм, странно, что он работает на меня. Если вы перезагрузитесь, не нажимая на него, div будет скрыт, но когда вы нажмете кнопку (очистите память) и перезагрузите, div должен вернуться. – Mihailo

+1

@monemacu Вы можете использовать 'localStorage.removeItem (« имя переменной localStorage, которую вы хотите удалить »);' для удаления из localStorage. –

1

Пробег: localStorage.

Устанавливаемая

localStorage.setItem('selectedId', 100); 

получить деталь

localStorage.getItem('selectedId'); 

Наконец, Удалить элемент

localStorage.removeItem("selectedId"); 

Пример

$(document).ready(function(){ 
    //Function for events 
    function dummyFunction(){ 
     $("#divid1").hide(); //want this to keep hidden after refresh 
     $("#hideid1").hide(); //want this to keep hidden after refresh 
     $("#id1").show(); //want this to keep showing after refresh 
    } 
    //Check localStorage value 
    if(localStorage.setItem('itemClicked') == 1) 
    { 
     dummyFunction(); 
    } 
    //Div click event 
    $("#divid1").click(function(){ 
     dummyFunction(); 
     //Set localStorage 
     localStorage.setItem('itemClicked', 1); 
    }); 
}); 
+0

предоставьте мне, как это произошло при кодировании – monemacu

+0

Я обновил свой ответ, проверьте, как использовать localStorage. И дайте мне знать, если у вас все еще есть проблемы. –

+1

переместите повторный код в метод, чтобы он был более чистым. И вы, вероятно, хотите указать, что код должен жить в нижней части тела или использовать готовый документ. – epascarello

-1

Вы можете использовать куки для вызова такой же, как если бы пользователь нажал на странице загрузки.

Кроме этого, вы отвратителен. Обновление страницы предназначено для сброса javascript страницы.

-1

Я надеюсь, что следующий код поможет вам. Просто поместите код в событие загрузки и устраните проблему.

$(window).load(function(){ 
 
    $("#divid1").hide(); 
 
    $("#hideid1").hide(); 
 
    $("#id1").show(); 
 
});
.hide{ 
 
    display:none; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img src="/img/done.png" id="divid1" alt="divid1"/> 
 
<img src="/img/schedule.png" height="12" width="12" id="hideid1" alt="hideid1" /> 
 
<div id="id1" class="hide"><img src="/img/done.png" height="12" width="12" alt="id1" /></div>

+0

Это не то, о чем просит ОП .... – epascarello

Смежные вопросы