do not reload page when modal is open

问题

this is my very first question here. I want to prevent reloading a page from browser reload button only when a modal is open. otherwise it can be reloaded. I should show an alert saying that the modal should be closed before reloading or something like that.

HTML:

<div id="newwr" class="modal newwr">
    <div class="modal-content">
        <h4>Create a WR</h4>
        <p>...</p>
    </div>
</div>

JAVASCRIPT:

<script>
    window.onbeforeunload = function() {
        if (modal.isOpen()) {
          alert("Modal should be closed before reloading the page");
        }
    }
</script>

回答1:

You could use onbeforeunload to provide that kind of response.

window.onbeforeunload = function() {
    if (modal.isOpen()) {
      return "Modal should be closed before reloading or something...";
    }
}

You'll need to determine whether the modal is open or not somehow. You could keep track of the state internally (as I've tried to show with pseudocode here), or by checking the DOM to see if your modal is present and/or visible.

As stated in the comments, we can provide more specific help once we know more about your code, but hopefully this will point you in the right direction.

来源：https://stackoverflow.com/questions/31167669/do-not-reload-page-when-modal-is-open