Если пользователь обновит страницу, о которой идет речь, она добавит еще одну запись в базу данных, поэтому я хочу предупредить пользователя через окно предупреждения, если они действительно хотят обновить страницу, и если они нажмут ok, страница должна быть обновлена в противном случае, если они нажмут отменить, это не будет.
Как сделать этот тип предупреждающего окна появляться, когда кнопка обновления браузера нажата так, как это кросс-браузер совместим?
Вы можете сделать это следующим образом:
window.onbeforeunload = function() {
return "Data will be lost if you leave the page, are you sure?";
};
Это отобразит запрос пользователю, позволяющий им отменить. Он не обновляет конкретные, но для ваших целей (например, редактирование вопроса на SO), что, похоже, не имеет значения, это потеря информации независимо от того, куда вы уходите.
Нет способа привязать его только к действию обновления, но вы можете посмотреть в window.onbeforeunload. Это позволит вам запустить функцию, которая возвращает строку непосредственно перед выгрузкой страницы. Если эта строка не пуста, то появится диалоговое окно подтверждения всплывающих окон, содержащее эту строку и другой текст шаблона, предоставленный в браузере.
Например:
window.onbeforeunload = function () {
if (someConditionThatIndicatesIShouldConfirm) {
return "If you reload this page, your previous action will be repeated";
} else {
return "";
}
}
Также, если текущая страница была загружена с помощью операции POST, браузер должен уже отображать окно подтверждения, когда пользователь пытается его обновить. Как правило, любое действие, которое изменяет состояние данных на сервере, должно выполняться с помощью запроса POST, а не GET.
Есть два возможных пути с этим, оба совершенно разные.
Один из способов - связать обработчик событий с событием onbeforeunload, чтобы вы могли обнаружить, когда пользователь просматривает текущую страницу. Однако, если моя память служит мне правильно, onbeforeunload несовместим в разных браузерах (я не думаю, что Opera ответит на него IIRC, но в настоящий момент не может протестировать). Конечно, это решение выходит из строя, если пользователь отключает JavaScript.
Вторым и более надежным способом было бы реализовать Post Redirect Get pattern, который при использовании предотвращает данные будут опубликованы снова, когда пользователь обновит страницу.
Это невозможно. Лучшее, что вы можете сделать, это использовать событие onbeforeunload, но оно будет срабатывать при любом событии, покидающем текущую страницу. Невозможно настроить таргетинг на кнопку обновления.
См. этот вопрос на onbeforeunload
Возможно, было бы лучше создать двойную проверку в вашей базе данных. Это также приведет к случайным представлениям с помощью кнопки "Назад".
Альтернативой может быть использование случайного одноразового токена, который встроен в форму. Если две операции будут предприняты с использованием одного и того же токена, вы остановите его.
вы можете использовать jquery для этого... для этого вам нужно прикрепить js файл jquery.
<script>
var count=0;
$(document).ready(function(){
alert("hi" + (count++));
confirm("sure?")
});
</script>