Как отключить кнопку после нажатия на нее, если пользователь обновляет веб-страницу?

Я создал веб-страницу HTML 5 + JavaScript. На моей странице у меня есть кнопка «submit». Когда я нажмете на это, значение кнопки изменится на «Готово». Но если я обновляю свою страницу после нажатия кнопки «отправить», появляется значение по умолчанию для кнопки («отправить»).Как отключить кнопку после нажатия на нее, если пользователь обновляет веб-страницу?

Что мне нужно, когда я нажал эту кнопку, это значение должно быть только «сделано», даже если пользователь обновляет свою страницу. Есть ли какой-либо конкретный метод для этого?

<style> 
.selectBtn{height:60px;width:80px; 
background-color:yellow;} 
#abc{background-color:gray;height:100%;width:60%;} 
</style> 
</head> 
<body><div id='abc'></div> 
<script> 
content = document.getElementById('abc'); 
function dx(){ 
var Btn = document.createElement('button'); 
Btn.type = 'button';Btn.className = 'selectBtn'; 
Btn.innerHTML = 'Submit'; 
Btn.onclick = function() 
{ 
this.innerHTML='Done'; 
} 
content.appendChild(Btn); 
} 
dx(); 
</script>

источник

2013-07-19 jmj

Вы не можете сделать это с помощью только кода на стороне клиента. Вы можете сделать что-то подобное с localStorage, но это работает до тех пор, пока пользователь не очистит его на стороне клиента. –

go и google localStorage.getItem или localStorage.setItem :) Это может быть идея для безопасного фактического состояния кнопки. –

Как долго должна быть кнопка с надписью 'Done'? Что произойдет, если пользователь закроет окно и снова откроет страницу? –

Вы можете хранить информацию о том, нажата ли кнопка, в файле cookie. Вы можете установить и прочитать этот файл cookie с помощью javascript и отключить кнопку, если cookie существует или имеет особое значение. Это легко обмануть, пользователь может удалить или изменить файлы cookie. Если вам нужно, чтобы он был более надежным, вам нужно сохранить его на стороне сервера.

источник

2013-07-19 12:48:24

Для хранения серверной части также необходим файл cookie. Удаление файла cookie означает потерю информации о пользователе/сеансе. Так что это не является более надежным. –

@ t.niese Ну, вы можете хранить пользовательский агент и/или пользовательский ip, чем вам не нужен файл cookie. Но я должен согласиться, что он по-прежнему является чистым, если не будет внедрена полностью функциональная система входа в систему (пользовательские сессии). –

Спасибо, ребята. Затем я попытаюсь сохранить его на стороне сервера. – jmj

Попробуйте

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

Btn.onclick = function() 
{ 
    this.innerHTML='Done'; 
    var hdnvalue=document.getElementById("hiddenfield1"); 
    hdnvalue.value="true"; 
} 

function pageload() 
{ 
    var hdnvalue=document.getElementById("hiddenfield1"); 
    if(hdnvalue=="true") 
    { 
    Btn.innerHTML='Done'; 
    } 
}

источник

2013-07-19 12:50:24

Ну а при перезагрузке скрытое поле снова будет иметь значение по умолчанию. Некоторые браузеры сохраняют статистику полей ввода (я не знаю, верно ли это для скрытых полей) при перезагрузке, но не у всех. –

это не работает Arun – jmj

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

btn.innerHTML=localStorage.btn_value 


Btn.onclick = function() 
{ 
this.innerHTML='Done'; 
localStorage.btn_value=this.innerHTML; 
}

Это должно работать ...

источник

2013-07-19 12:54:16

будет создавать кнопки с поддержкой DOM localstorage? – jmj

@jmj 'localStorage' _is_ более мощный' cookie'. Вы можете проверить это для получения дополнительной информации: http://diveintohtml5.info/storage.html –

@jmj localStorage - простой магазин, на нем неважно DOM. И код Button использует localStorage сам по себе. – Zlatko

Вы могли бы разработать (полу) HTML5 для этого путь.

При нажатии кнопки также изменяется URL-адрес. Затем вы можете установить значение кнопки «done» на сервере. Или ваш серверный код может игнорировать это, и вы используете JS для его исправления.

Чистый JavaScript решение здесь: Первое - изменить хэш представить ..

Btn.onclick = function() { 
    // do Ajaxy submit here 
    MyFramework.Ajax.submit(); 
    // now alter the hash 
    // also, you could also move this in the ajax callback function 
    // - to make sure the submit worked. 
    window.location.hash = 'done'; 
}

Теперь эта часть, давайте назовем это, кнопка инициализации - она проверяет значения хэш. Предположим, вы инициализировали свою кнопку с помощью Javascript.

Button.init = function { // or onPageLoad or whatever 
    if('#done' == window.location.hash) { 
    Button.setLabel('Done'); // or variation thereof 
    } 
};

Edit: Просто видел, как вы уже INIT функцию: дх, поэтому изменить линию Btn.innerHTML = 'Submit'; к if('#done' == window.location.hash) { Btn.innerHTML = 'Done'; } else { Btn.innerHTML = 'Submit'; }

Конечно, если вы уже действительно используют хэш, вы должны включать в себя, если или два :)

источник

2013-07-19 13:01:41 Zlatko

Как насчет хранения сессии? Кнопка покажет «сделано» до тех пор, пока пользователь не закроет окно или вкладку

<style> 
.selectBtn{height:60px;width:80px; 
    background-color:yellow;} 
#abc{background-color:gray;height:100%;width:60%;} 
</style> 
</head> 
<body><div id='abc'></div> 
<script> 
content = document.getElementById('abc'); 

function dx(){ 
    var Btn = document.createElement('button'); 
    Btn.type = 'button'; 
    Btn.className = 'selectBtn'; 
    Btn.innerHTML = 'Submit'; 
    Btn.onclick = function() { 
    this.innerHTML='Done'; 
    sessionStorage.done = true; 
    } 
    if (sessionStorage.done) { 
    Btn.innerHTML = 'Done'; 
    } 
    content.appendChild(Btn); 
} 

dx(); 
</script>

источник

2013-07-19 13:14:52 sabof

Как отключить кнопку после нажатия на нее, если пользователь обновляет веб-страницу?

ответ

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