Как вскрыть окно предупреждения при нажатии кнопки обновления браузера?

19

Если пользователь обновит страницу, о которой идет речь, она добавит еще одну запись в базу данных, поэтому я хочу предупредить пользователя через окно предупреждения, если они действительно хотят обновить страницу, и если они нажмут ok, страница должна быть обновлена в противном случае, если они нажмут отменить, это не будет.

Как сделать этот тип окна предупреждения появляться, когда кнопка обновления браузера нажата так, как это кросс-браузер совместим?

    
задан Faber 11.07.2010 в 01:01
источник

5 ответов

35

Вы можете сделать это следующим образом:

window.onbeforeunload = function() {
  return "Data will be lost if you leave the page, are you sure?";
};

Это отобразит запрос пользователю, позволяющий им отменить. Это не обновление, но для ваших целей (например, редактирование вопроса на SO), которое, похоже, не имеет значения, это потеря информации независимо от того, куда вы уходите.

    
ответ дан Nick Craver 11.07.2010 в 01:05
источник
  • Один вопрос, однако, ваше сообщение «Данные будут потеряны, если вы покинете страницу, вы уверены?» появляется под другим сообщением в окне предупреждения: «Вы уверены, что хотите перейти от этой страницы», а внизу появляется сообщение «нажмите продолжить, чтобы перейти или отменить, чтобы оставаться на текущей странице». Есть ли способ настроить эти 2 других сообщения? –  Faber 11.07.2010 в 01:20
  • @Faber - Не то, чтобы я знал ... это для каждого браузера, которое будет меняться, событие onbeforeunload очень нестандартно. –  Nick Craver♦ 11.07.2010 в 01:23
  • также я просто размышляю здесь, но можно ли обнаружить обновление страницы, проверив, будет ли URL-адрес, по которому идет следующий, соответствует URL-адресу текущей страницы, как-то с js? Потому что теперь, если пользователь нажимает на главную страницу или какую-то другую страницу, которая не добавит другую запись в db, она по-прежнему выводит это сообщение. –  Faber 11.07.2010 в 01:23
  • @Faber - Нет способа увидеть URL-адрес, на который вы собираетесь, а не общий способ ... если бы был способ, веб-сайты могли видеть, куда вы идете, когда вы их покидаете , скажем, когда вы набрали новый адрес в адресной строке ... вы видите, как это быстро становится проблемой конфиденциальности, что-то, что вы не хотите показывать на сайтах сценариев, может работать. –  Nick Craver♦ 11.07.2010 в 01:26
  • @NickCraver Можем ли мы настроить его, если мы нажмем да, тогда форма будет отправлена ​​Ex-: document.forms ["myForm"]. submit (); и onclick of No it остался на одной странице ... Пожалуйста, предложите мне ссылку: stackoverflow.com/questions/34767942/... –  KuldeeP ChoudharY 13.01.2016 в 14:34
8

Нет способа привязать его только к действию обновления, но вы можете посмотреть в window.onbeforeunload . Это позволит вам запустить функцию, которая возвращает строку непосредственно перед выгрузкой страницы. Если эта строка не пуста, то появится диалоговое окно подтверждения всплывающих окон, содержащее эту строку и другой текст шаблона, предоставленный в браузере.

Например:

window.onbeforeunload = function () {
    if (someConditionThatIndicatesIShouldConfirm) {
        return "If you reload this page, your previous action will be repeated";
    } else {
        //Don't return anything
    }
}

Также , если текущая страница была загружена с помощью операции POST , браузер должен уже отображать окно подтверждения, когда пользователь пытается его обновить. Как правило, любое действие, которое изменяет состояние данных на сервере, должно выполняться с помощью POST запроса, а не GET .

    
ответ дан pkaeding 11.07.2010 в 01:04
источник
  • Это поведение сработало для меня - когда я ушел из возврата »- кажется, что возвращение любой строки приведет к подсказке –  stackdump 08.08.2017 в 18:13
  • Да, если вы хотите удалить приглашение, ничего не возвращайте –  Pierre 14.03.2018 в 16:08
2

Есть два возможных пути с этим, оба совершенно разные.

Один из способов - связать обработчик события с onbeforeunload , чтобы вы могли обнаружить, когда пользователь просматривает с текущей страницы. Если моя память служит мне правильно, onbeforeunload не является согласованным во всех браузерах (я не думаю, что Opera реагирует на него IIRC, но не имеет возможности протестировать). Конечно, это решение выходит из строя, если пользователь отключает JavaScript.

Второй и более надежный способ заключается в реализации шаблона Post Redirect Get , который при использовании предотвращает повторную отправку данных, когда пользователь обновляет страницу.

    
ответ дан Russ Cam 11.07.2010 в 01:09
источник
  • +1 для почтового перенаправления Get –  Robert 11.07.2010 в 02:38
1

Это невозможно. Лучшее, что вы можете сделать, это использовать событие onbeforeunload , но оно будет срабатывать при событии any , оставив текущую страницу. Невозможно настроить таргетинг на кнопку обновления.

См. этот вопрос о onbeforeunload

Возможно, было бы лучше создать двойную проверку в вашей базе данных. Это также приведет к случайным представлениям с помощью кнопки «Назад».

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

ответ дан Unicron 11.07.2010 в 01:05
источник
0

вы можете использовать jquery для этого ...     для этого вам нужно прикрепить js-файл jquery.

<script>
var count=0;
$(document).ready(function(){
    alert("hi" + (count++));
    confirm("sure?")
});
</script>
    
ответ дан Sanjay Patel 28.09.2013 в 16:55
источник
  • он спросил о кнопке обновления –  ppaulojr 28.09.2013 в 17:15