Използвам dirty-forms / are-you-sure js на тестов формуляр, който потвърждава дали потребителят иска да навигирайте далеч от страница с незапазени промени.
Това работи според очакванията, но аз също използвам изображение „моля, изчакайте“, което показва, когато потребителят се обади на сървъра.
Как да задействам изображението „моля, изчакайте“ САМО когато потребителят кликне върху бутона „Напускане на тази страница“ на -сигурен ли си изскачащ прозорец за съобщение?
В момента имам задействано изображение за моля, изчакайте, за да се появи, когато потребителят щракне върху бутона за отмяна, b/c Не мога да се сетя откъде другаде да го задействам.
Ето моя ‹ head > код:
<div id="loading-div-background">
<div id="loading-div" >
<img src="{{ STATIC_URL }}img/page-loader.gif" />
</div>
</div>
Ето кода на моя шаблон:
<a href="/bg{% url certification_details %}" class="btn" onclick="showProgressAnimation();">Cancel</a>
Ето js кода, който имам:
<script>
$('form').areYouSure( {'message':'You have unsaved changes.'} );
</script>
РЕДАКТИРАНЕ - добави css за скриване на изображението, както беше поискано.
Това е CSS, който скрива иконата Моля, изчакайте, когато първата страница се зареди:
#loading-div-background {
background-color: rgba(246,246,246,0.7);
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
}