창 js 이벤트 (14)

브라우저 창/탭 닫기 이벤트를 캡처하고 싶습니다. jQuery로 다음을 시도했습니다.

JQuery(window).bind("beforeunload", function() ( return verify("정말로 닫으시겠습니까?") ))

그러나 이는 내가 원하는 것이 아닌 양식 제출에도 작동합니다. 사용자가 창을 닫을 때만 실행되는 이벤트를 원합니다.

jQuery 1.7부터 .live() 메소드는 더 이상 사용되지 않습니다. .on()을 사용하여 이벤트 핸들러를 연결합니다. 이전 사용자 jQuery 버전.live()보다 .delegate()를 사용해야 합니다.

$(window).bind("beforeunload", function() ( return true || verify("정말로 닫으시겠습니까?"); ));

$(창).바인딩 해제();

JQuery(window).bind("beforeunload", function (e) ( var activeElementTagName = e.target.activeElement.tagName; if (activeElementTagName != "A" && activeElementTagName != "INPUT") ( return "정말로 원하십니까? 닫을까요?"; ) ))

내 대답은 간단한 테스트를 제공하는 것을 목표로 합니다.

어떻게

@SLaks 답변을 참조하세요.

$(window).on("beforeunload", function() ( return inFormOrLink ? "정말로 닫으시겠습니까?" : null; ))

브라우저가 최종적으로 페이지를 닫는 데 얼마나 걸리나요?

사용자가 페이지를 닫을 때마다(x 버튼 또는 Ctrl+W) 브라우저가 실행됩니다. 이 코드 beforeunload 이전이지만 무기한은 아닙니다. 유일한 예외는 사용자의 응답을 기다리는 확인 창("정말로 닫으시겠습니까?" 반환)입니다.

크롬: 2초.
Firefox: (또는 두 번 클릭하거나 강제로 닫음)
가장자리: (또는 두 번 클릭)
익스플로러 11: 0초.
원정 여행: 할 것

우리가 이것을 테스트하는 데 사용한 것:

• 요청 로그가 있는 Node.js Express 서버
• 다음의 짧은 HTML 파일

이것이 하는 일은 브라우저가 페이지를 완료하기 전에 (동기적으로) 가능한 한 많은 요청을 보내는 것입니다.

function request() ( return $.ajax(( 유형: "GET", url: "http://localhost:3030/" + Date.now(), async: true )).responseText; ) window.onbeforeunload = ( ) => ( while (true) ( ​​​​request(); ) return null; )

크롬 출력:

GET /1480451321041 404 0.389ms - 32 GET /1480451321052 404 0.219ms - 32 ... GET /hello/1480451322998 404 0.328ms - 32 1957ms ≒ 2초 // 요청에 몇 밀이 걸릴 수 있으므로 2초로 가정합니다. ~까지 1초 전송됩니다.

이것도 시도해 보세요

Window.onbeforeunload = function () ( if (pasteEditorChange) ( var btn = verify("변경 사항을 저장하시겠습니까?"); if(btn === true)( SavetoEdit();//함수 호출 ) else ( windowClose();//함수 호출 ) ) else ( windowClose();//함수 호출 ) );

확인해 보세요...

함수 wopen_close())( var w = window.open($url, "_blank", "너비=600, 높이=400, 스크롤바=no, 상태=no, 크기 조정 가능=no, screenx=0, screeny=0") ; w.onunload = function() ( if (window.closed) ( Alert("창이 닫혔습니다"); )else( Alert("새로고침되었습니다"); ) ) )

불행하게도 새로고침, 새 페이지 리디렉션 또는 브라우저 닫기 이벤트가 트리거됩니다. 대안은 이벤트를 발생시키는 ID를 잡아서 양식인 경우 함수를 호출하지 말고, 양식 ID가 아닌 경우 페이지가 닫힐 때 수행하려는 작업을 수행하는 것입니다. 이것이 직접적으로 가능하고 지루한지 잘 모르겠습니다.

클라이언트가 탭을 닫기 전에 수행할 수 있는 몇 가지 작은 작업이 있습니다. javascript는 브라우저 탭 닫기/브라우저 닫기를 감지하지만 작업 목록이 크고 탭이 완료되기 전에 닫히면 무력합니다. 시도해 볼 수 있지만 내 경험으로는 그것에 의존하지 않습니다.

Window.addEventListener("beforeunload", function (e) ( var 확인 메시지 = "\o/"; /* 여기에 작은 작업 코드를 입력하세요 */ (e || window.event).returnValue = 확인 메시지; //Gecko + IE return 확인 메시지; //웹킷, 사파리, 크롬 ));

양식 보기가 다른 페이지로 보내는 경우(예: beforeunload 실행 중) 양식의 beforeunload를 ajax 호출로 변경해 볼 수 있습니다. 이렇게 하면 양식이 beforeunload될 때 페이지를 떠나지 않으며 원하는 대로 beforeunload 바인딩을 사용할 수 있습니다.

다양한 이유로 앵커 태그를 사용하는 Telerik(예: RadComboBox) 및 DevExpress와 같은 타사 컨트롤과 잘 작동하는 솔루션의 경우 자체 앵커 태그에 대한 더 나은 선택기를 갖춘 desm 코드의 약간 향상된 버전인 다음 코드를 고려하세요. 바인딩:

Var inFormOrLink; $("a:not(), a").live("click", function() ( inFormOrLink = true; )); $("form").bind("submit", function() ( inFormOrLink = true; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefine; if (!inFormOrLink) ( returnValue = "정말로 닫으시겠습니까?"; } eventObject.returnValue = returnValue; return returnValue; });!}

Slaks를 사용했는데 onbeforeunload returnValue가 문자열로 파싱된 후 브라우저 확인 창에 표시되기 때문에 그대로 작동하지 않습니다. 이렇게 표시됩니다 진실, 예를 들어 "true"입니다.

그냥 사용 피드백. 여기 내 코드가 있습니다

Var PreventUnloadPrompt; var messageBeforeUnload = "여기에 메시지가 있습니다. 이 페이지를 떠나시겠습니까?"; //varredirectAfterPrompt = "http://www.google.co.in"; $("a").live("click", function() (preventUnloadPrompt = true; )); $("form").live("submit", function() (preventUnloadPrompt = true; )); $(window).bind("beforeunload", function(e) ( var rval; if(preventUnloadPrompt) ( return; ) else ( //location.replace(redirectAfterPrompt); return messageBeforeUnload; ) return rval; ))

Var validNavigation = false; jQuery(문서).ready(function () ( wireUpEvents(); )); function endSession() ( // 브라우저 또는 브라우저 탭이 닫혔습니다 // 여기서 작업을 수행하십시오 ... Alert("bye"); ) function wireUpEvents() ( /* * IE에서 onbeforeunload를 트리거하는 이벤트 목록은 * http를 확인하십시오. ://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx */ window.onbeforeunload = function () ( debugger if (!validNavigation) ( endSession(); ) ) // F5 새로 고침을 제외하는 이벤트 키 누르기 $(document).bind("keypress", function (e) ( debugger if (e.keyCode == 116) ( validNavigation = true; ) )); // 모두에 대해 이벤트 클릭 연결 페이지의 링크 $("a").bind("click", function () ( debugger validNavigation = true; )); // 페이지의 모든 양식에 대한 이벤트 제출 $("form").bind( "submit", function () ( debugger validNavigation = true; )); // 페이지의 모든 입력에 대한 이벤트 클릭 연결 $("input").bind("click", function () ( debugger validNavigation = true; )); )`여기에 코드를 입력하세요`

내 문제: "onbeforeunload" 이벤트는 제출(클릭) 횟수가 홀수인 경우에만 실행됩니다. 내 솔루션이 작동하도록 하기 위해 SO에서 유사한 스레드의 솔루션 조합을 사용했습니다. 좋아, 내 코드가 말해줄 거야.

$(document).ready(function() ( updatefgallowPrompt(true); window.onbeforeunload = WarnUser; ) function WarnUser() ( varallowPrompt = getfgallowPrompt(); if(allowPrompt) ( saveIndexedDataAlert(); return null; ) else ( updatefgallowPrompt(true); event.stopPropagation ) ) 함수 saveIndexedDataAlert() ( varallowPrompt = getfgallowPrompt(); var lenIndexedDocs =parseInt($("#sortable3 > li").size()) +parseInt($("#sortable3 > ul").size()); if(allowPrompt && $.trim(lenIndexedDocs) > 0) ( event.returnValue = "메시지"; } else { event.returnValue = " "; updatefgallowPrompt(true); } } $(document).click(function(event) { $("a").live("click", function() { updatefgallowPrompt(false); }); }); function updatefgallowPrompt (allowPrompt){ //exit msg dfds $("body").data("allowPrompt", allowPrompt); } function getfgallowPrompt(){ return $("body").data("allowPrompt"); }!}

그 후에는 나를 위해 일했습니다.

$(window).unload(function(event) ( if(event.clientY< 0) { //do whatever you want when closing the window.. } });

Window.onbeforeunload = function () ( return "정말로 닫으시겠습니까?"; );

아마도 양식의 제출 이벤트 핸들러에 있는 beforeunload 이벤트 핸들러일 것입니다.

JQuery("form").submit(function() ( jQuery(window).unbind("beforeunload"); ... ));

2

하나의 상위 페이지와 하위 페이지가 있습니다. 새 탭에서 하위 페이지가 열림

하위 탭을 닫을 때 하나의 경고 메시지(하위 페이지 닫기)를 표시하고 싶습니다.
탭을 닫을 때 닫힌 메시지를 표시하는 방법은 무엇입니까? (상쾌한 시간은 아닙니다)

나는 OnUnload와 onbeforeunload를 사용했습니다.
두 메서드는 페이지를 새로 고치고 탭을 닫을 때도 호출됩니다.

Window.onunload = function doUnload(e) ( Alert("하위 창이 닫힙니다..."); )

Window.onbeforeunload = function doUnload(e) ( Alert("하위 창이 닫힙니다..."); )

경고 메시지를 표시해야 합니다. 브라우저의 탭을 닫으면 됩니다.

도와주세요. 미리 감사드립니다.

다음 스크립트를 사용하고 있습니다. IE에서는 작동했습니다. 하지만 FireFox에서는 작동하지 않았습니다.

window.onbeforeunload = function() ( if ((window.event.clientX< 0) || (window.event.clientY < 0) || (window.event.clientX < -80)) { alert("Child window is closing..."); } };

FireFox 및 기타 브라우저에서 이를 달성하는 방법.

• 답변 4개

정렬:

활동

1

이 afaik은 크로스 브라우저 시나리오가 아니었습니다. 해결책은 중요한 것을 감지하기 위해 문서화되지 않은 가변 브라우저 특정 기능에 의존하지 않는 것입니다.

CHILD 페이지가 있으므로 일정 간격으로 childWindowHandle.closed 속성을 확인하고 이에 대해 조치를 취하는 부모(오프너)에 대한 테스트를 설정할 수 있습니다.

1

beforeunload Crossbrowser 이벤트를 실행하려고 한다고 가정하면 거의 모든 작업이 수행됩니다(Opera 제외).

Try( // http://www.opera.com/support/kb/view/827/ Opera.setOverrideHistoryNavigationMode("호환"); History.navigationMode = "호환"; )catch(e)() //우리의 위치 F" Are You Going 메시지 function ReturnMessage() ( return "WTF!!!"; ) //UnBind 함수 function UnBindWindow() ( window.onbeforeunload = null; return true; ) //문서에 영향을 주지 않으려는 링크 바인딩 .getElementById("homebtn").onclick = UnBindWindow; document.getElementById("googlebtn").onclick = UnBindWindow; //바인딩 종료 메시지 대화상자 window.onbeforeunload = ReturnMessage;

0

지속성이 없기 때문에 개발 해결 방법인 일부 쿠키 기반 방법을 제외하고는 이 작업을 수행하지 못할 수도 있습니다. 쿠키. 페이지 새로 고침, 양식 기반 리디렉션 또는 역방향 리디렉션 또는 이벤트 덤핑으로 인한 브라우저 닫기의 두 번째 식별은 간단하지도 지루하지도 않습니다. 이에 의존하지 않는 것이 좋습니다.

클라이언트가 탭을 닫기 전에 몇 가지 작은 작업을 수행할 수 있습니다. javascript는 브라우저 탭 닫기/브라우저 닫기를 감지하지만 작업 목록이 크고 탭이 완료되기 전에 닫히면 무력합니다. 시도해 볼 수 있지만 내 경험으로는 그것에 의존하지 않습니다. 예, 지금은 뒤로, 업데이트, 닫기를 구분할 수 없습니다. 그러므로 아이가 정말로 닫혀 있는지를 알 수 있는 확실한 방법은 없습니다.

Window.addEventListener("beforeunload", function (e) ( var 확인 메시지 = "\o/"; /* 여기에 작은 작업 코드를 입력하세요 */ (e || window.event).returnValue = 확인 메시지; //Gecko + IE return 확인 메시지; //웹킷, 사파리, 크롬 ));

js 페이지 새로고침 이벤트 (14)

브라우저 창/탭 닫기 이벤트를 캡처하고 싶습니다. jQuery로 다음을 시도했습니다.

JQuery(window).bind("beforeunload", function() ( return verify("정말로 닫으시겠습니까?") ))

그러나 이는 내가 원하는 것이 아닌 양식 제출에도 작동합니다. 사용자가 창을 닫을 때만 실행되는 이벤트를 원합니다.

아마도 양식의 제출 이벤트 핸들러에 있는 beforeunload 이벤트 핸들러일 것입니다.

JQuery("form").submit(function() ( jQuery(window).unbind("beforeunload"); ... ));

양식 보기가 다른 페이지로 보내는 경우(예: beforeunload 실행 중) 양식의 beforeunload를 ajax 호출로 변경해 볼 수 있습니다. 이렇게 하면 양식이 beforeunload될 때 페이지를 떠나지 않으며 원하는 대로 beforeunload 바인딩을 사용할 수 있습니다.

이것도 시도해 보세요

Window.onbeforeunload = function () ( if (pasteEditorChange) ( var btn = verify("변경 사항을 저장하시겠습니까?"); if(btn === true)( SavetoEdit();//함수 호출 ) else ( windowClose();//함수 호출 ) ) else ( windowClose();//함수 호출 ) );

그 후에는 나를 위해 일했습니다.

$(window).unload(function(event) ( if(event.clientY< 0) { //do whatever you want when closing the window.. } });

Slaks를 사용했는데 onbeforeunload returnValue가 문자열로 파싱된 후 브라우저 확인 창에 표시되기 때문에 그대로 작동하지 않습니다. 이는 true 값이 표시되는 방식입니다(예: "true").

피드백을 사용하는 것뿐입니다. 여기 내 코드가 있습니다

Var PreventUnloadPrompt; var messageBeforeUnload = "여기에 메시지가 있습니다. 이 페이지를 떠나시겠습니까?"; //varredirectAfterPrompt = "http://www.google.co.in"; $("a").live("click", function() (preventUnloadPrompt = true; )); $("form").live("submit", function() (preventUnloadPrompt = true; )); $(window).bind("beforeunload", function(e) ( var rval; if(preventUnloadPrompt) ( return; ) else ( //location.replace(redirectAfterPrompt); return messageBeforeUnload; ) return rval; ))

Var validNavigation = false; jQuery(문서).ready(function () ( wireUpEvents(); )); function endSession() ( // 브라우저 또는 브라우저 탭이 닫혔습니다 // 여기서 작업을 수행하십시오 ... Alert("bye"); ) function wireUpEvents() ( /* * IE에서 onbeforeunload를 트리거하는 이벤트 목록은 * http를 확인하십시오. ://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx */ window.onbeforeunload = function () ( debugger if (!validNavigation) ( endSession(); ) ) // F5 새로 고침을 제외하는 이벤트 키 누르기 $(document).bind("keypress", function (e) ( debugger if (e.keyCode == 116) ( validNavigation = true; ) )); // 모두에 대해 이벤트 클릭 연결 페이지의 링크 $("a").bind("click", function () ( debugger validNavigation = true; )); // 페이지의 모든 양식에 대한 이벤트 제출 $("form").bind( "submit", function () ( debugger validNavigation = true; )); // 페이지의 모든 입력에 대한 이벤트 클릭 연결 $("input").bind("click", function () ( debugger validNavigation = true; )); )`여기에 코드를 입력하세요`

아마도 OnSubmit을 처리하고 나중에 OnBeforeUnload 핸들러에서 확인할 플래그를 설정할 수 있습니다.

JQuery(window).bind("beforeunload", function (e) ( var activeElementTagName = e.target.activeElement.tagName; if (activeElementTagName != "A" && activeElementTagName != "INPUT") ( return "정말로 원하십니까? 닫을까요?"; ) ))

다양한 이유로 앵커 태그를 사용하는 Telerik(예: RadComboBox) 및 DevExpress와 같은 타사 컨트롤과 잘 작동하는 솔루션의 경우 자체 앵커 태그에 대한 더 나은 선택기를 갖춘 desm 코드의 약간 향상된 버전인 다음 코드를 고려하세요. 바인딩:

Var inFormOrLink; $("a:not(), a").live("click", function() ( inFormOrLink = true; )); $("form").bind("submit", function() ( inFormOrLink = true; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefine; if (!inFormOrLink) ( returnValue = "정말로 닫으시겠습니까?"; } eventObject.returnValue = returnValue; return returnValue; });!}

내 대답은 간단한 테스트를 제공하는 것을 목표로 합니다.

어떻게

@SLaks 답변을 참조하세요.

$(window).on("beforeunload", function() ( return inFormOrLink ? "정말로 닫으시겠습니까?" : null; ))

브라우저가 최종적으로 페이지를 닫는 데 얼마나 걸리나요?

사용자가 페이지를 닫을 때마다(x 버튼 또는 CTRL + W) 브라우저는 beforeunload 전에 이 코드를 실행하지만 무기한 실행하지는 않습니다. 유일한 예외는 사용자의 응답을 기다리는 확인 창("정말로 닫으시겠습니까?" 반환)입니다.

크롬: 2초.
Firefox: (또는 두 번 클릭하거나 강제로 닫음)
가장자리: (또는 두 번 클릭)
익스플로러 11: 0초.
원정 여행: 할 것

우리가 이것을 테스트하는 데 사용한 것:

• 요청 로그가 있는 Node.js Express 서버
• 다음의 짧은 HTML 파일

이것이 하는 일은 브라우저가 페이지를 완료하기 전에 (동기적으로) 가능한 한 많은 요청을 보내는 것입니다.

function request() ( return $.ajax(( 유형: "GET", url: "http://localhost:3030/" + Date.now(), async: true )).responseText; ) window.onbeforeunload = ( ) => ( while (true) ( ​​​​request(); ) return null; )

크롬 출력:

GET /1480451321041 404 0.389ms - 32 GET /1480451321052 404 0.219ms - 32 ... GET /hello/1480451322998 404 0.328ms - 32 1957ms ≒ 2초 // 요청에 몇 밀이 걸릴 수 있으므로 2초로 가정합니다. ~까지 1초 전송됩니다.

브라우저 간 솔루션(Chrome 21, IE9, FF15에서 테스트됨)의 경우 Slaks 코드를 약간 수정한 다음 코드를 고려하세요.

Var inFormOrLink; $("a").live("클릭", function() ( inFormOrLink = true; )); $("form").bind("submit", function() ( inFormOrLink = true; )); $(window).bind("beforeunload", function(eventObject) ( var returnValue = undefine; if (!inFormOrLink) ( returnValue = "정말로 닫으시겠습니까?"; } eventObject.returnValue = returnValue; return returnValue; }); !}

Firefox 4에서는 "닫으시겠습니까?"라는 메시지가 나타납니다. 표시되지 않습니다. FF는 단순히 일반 메시지를 표시합니다. https://developer.mozilla.org/en-US/docs/DOM/window.onbeforeunload의 참고 사항을 참조하세요.

beforeunload 이벤트는 사용자가 어떤 이유로든 페이지를 떠날 때마다 실행됩니다.

예를 들어 사용자가 양식을 제출하거나, 링크를 클릭하거나, 창(또는 탭)을 닫거나, 다음으로 이동하는 경우 트리거됩니다. 새 페이지주소 표시줄, 검색창 또는 북마크를 사용합니다.

Var inFormOrLink; $("a").on("클릭", function() ( inFormOrLink = true; )); $("form").on("submit", function() ( inFormOrLink = true; )); $(window).on("beforeunload", function() ( return inFormOrLink ? "정말로 닫으시겠습니까?" : null; ))

1.7 이전 jQuery 버전의 경우 다음을 시도하십시오.

Var inFormOrLink; $("a").live("클릭", function() ( inFormOrLink = true; )); $("form").bind("submit", function() ( inFormOrLink = true; )); $(window).bind("beforeunload", function() ( return inFormOrLink ? "정말로 닫으시겠습니까?" : null; ))

라이브 메소드는 제출 이벤트와 함께 작동하지 않으므로 추가하면 새 유니폼, 핸들러도 바인딩해야 합니다.

다른 이벤트 핸들러가 제출 또는 탐색을 취소하는 경우 나중에 창이 실제로 닫히면 확인 메시지가 사라집니다. 제출 및 클릭 이벤트에 시간을 기록하고 beforeunload가 몇 초 이상 남았는지 확인하여 이 문제를 해결할 수 있습니다.

확인해 보세요...

함수 wopen_close())( var w = window.open($url, "_blank", "너비=600, 높이=400, 스크롤바=no, 상태=no, 크기 조정 가능=no, screenx=0, screeny=0") ; w.onunload = function() ( if (window.closed) ( Alert("창이 닫혔습니다"); )else( Alert("새로고침되었습니다"); ) ) )

jQuery 1.7부터 .live() 메소드는 더 이상 사용되지 않습니다. .on()을 사용하여 이벤트 핸들러를 연결합니다. 이전 버전의 jQuery 사용자는 .live()보다 .delegate()를 사용해야 합니다.

$(window).bind("beforeunload", function() ( return true || verify("정말로 닫으시겠습니까?"); ));

좋은 오후에요. 최근에 어떻게 하는지에 대한 글을 올렸는데, 방문자가 사이트를 떠날 때, 즉 페이지를 닫으려고 할 때 창이 나타나도록 거울 효과가 있는 글을 추가해 달라는 요청이 많았습니다.

오늘은 이 주제에 대해 이야기하고 간단한 구현을 보여 드리겠습니다.

물론 사이트에 닫기 팝업을 추가해야 하는지 여부에 대한 논쟁은 결코 멈추지 않을 것입니다. 어떤 사람들은 지옥에 그것을 추가하는 사람들을 위해 예약된 특별한 장소가 있다고 말합니다. 이것은 매우 격분하며, 내가 떠나기로 결정하면 떠날 것이며 어떤 팝업 창도 나를 막을 수는 없지만 나를 짜증나게 할 뿐이라고 말합니다. 다른 사람들은 이러한 팝업이 전환율을 높이고 효과가 좋다고 말합니다. 시도해 볼 가치가 있다고 생각하고 통계를 바탕으로 틈새 시장과 제품에 대한 구체적인 결론을 도출합니다.

페이지를 닫을 때 팝업을 만드는 방법

사실 저는 더 이상 고민하지 않고 이전 글을 약간 변경하고 자바스크립트 코드 몇 줄만 추가했습니다. 이전에는 사이트를 처음 방문하면 모달 창이 나타났습니다. 이제 사이트를 처음 방문할 때만 표시됩니다(커서가 사이트의 기본 영역을 떠나 탭 영역으로 이동하는 경우). 사용자가 해당 사이트를 다시 방문하면 이 창이 표시되지 않습니다. 이는 쿠키를 사용하여 이전 기사와 정확히 동일한 방식으로 구현됩니다. 쿠키는 7일 동안 저장되며 귀하의 재량에 따라 수량을 지정할 수 있습니다.

그러나 우리는 탭의 십자가 클릭에 대한 이벤트를 첨부하지 않고 단순히 커서의 위치를 ​​확인합니다. 창, 버튼 등을 차단하지 않으며 아무것도 필요하지 않으며 단순히 창을 표시합니다.

지난번과 마찬가지로 jQuery 플러그인 arcticModal을 사용합니다. 이는 jQuery 자체를 연결한다는 의미입니다.

그리고 플러그인 테마를 연결합니다. 저는 표준 테마를 사용하지만 직접 작성할 수도 있습니다.

이제 쿠키가 작동하도록 Yandex의 쿠키 플러그인을 추가하겠습니다.

그리고 config.js 스크립트를 다음 콘텐츠와 연결하세요.

$(document).ready(function () ( if (!$.cookie("smartCookies")) ( $(document).mouseleave(function (e) ( function getWindow() ( $(".offer").arcticmodal (( closeOnOverlayClick: true, closeOnEsc: true )); ); setTimeout(getWindow, 1); $.cookie("smartCookies", true, ( 만료: 7, 경로: "/" )); )); ); ) );

지난 기사를 읽으셨다면 config.js 파일의 스크립트가 약간 변경된 것 외에는 아무것도 변경되지 않았음을 알 수 있습니다. 즉, 커서가 사이트 영역, 즉 탭 영역을 떠날 때 트리거되는 또 다른 조건이 나타났습니다.

그런데 지난번에 이 매개변수가 무엇을 의미하는지 설명하는 것을 잊어버렸습니다.

CloseOnOverlayClick: 참, closeOnEsc: 참

• closeOnOverlayClick - 창 외부 영역을 클릭하면 창을 닫을 수 있습니다.
• closeOnEsc - Esc 키를 누르면 창을 닫습니다.

이제 페이지 레이아웃 자체에 대해 설명합니다. 전혀 변한 것이 없습니다.

귀하의 제안서, 양식 등이 여기에 있습니다. 소셜 네트워크에서 귀하를 팔로우하기 위한 양식이나 제안을 삽입할 수 있습니다.

조금 설명하겠습니다. modalInner — 래퍼 모달 창, 스타일에 display:none이 있습니다. Offer는 모달 창 자체의 클래스입니다. 변경하는 경우 스크립트에서 클래스를 변경하는 것을 잊지 마세요.

다음은 페이지를 닫을 때 팝업 창을 간단하게 구현한 것입니다. 웹사이트에서 비슷한 효과를 사용할 가치가 있다고 생각하시나요?

"onbeforeunload 이벤트는 사이트 제공 텍스트가 아닌 표준 메시지만 표시합니다." 주석으로 판단하면 최종적으로 취소할 수 없습니다. 이와 관련하여 저는 문제의 역사에 대해 조금 쓰고 싶었습니다.

많은 사람들은 onbeforeunload 덕분에 사용자에게 저장되지 않은 데이터가 있는 경우(예: 양식에 작성했지만 포럼에 메시지를 보내지 않은 경우) 웹 페이지를 떠나지 말라고 요청할 수 있다는 것을 알고 있습니다. 이렇게 하려면 다음 JavaScript와 같은 것을 추가하면 됩니다.
window.onbeforeunload = function (evt) ( var message = ""foo" 문서는 저장되지 않았습니다. 페이지를 나가면 변경 사항이 손실됩니다."; if (typeof evt == "undefine") ( evt = window.event ; ) if (evt) ( evt.returnValue = 메시지; ) 반환 메시지; )
그런 다음 이상적으로는 사용자가 페이지를 떠나고자 하는 경우(어떤 방법으로든 탭을 닫고, 전체 브라우저를 닫고, 페이지를 다시 로드하고, 다음을 입력합니다.) 새 주소 V 주소 표시 줄, 북마크로 이동 등) 확인 요청이 표시되며 페이지 나가기가 취소될 수 있습니다. 이전에 부도덕한 웹 사이트 작성자는 이 창을 사용하여 사용자를 속여 페이지에 머물게 하려고 했습니다. 예를 들어 "사이트 작업을 계속하려면 확인을 클릭하고 닫으려면 취소를 클릭하세요"라는 텍스트를 사용했습니다. 길 주변에). 또는 "신용 카드에 1,000달러 청구를 확인하려면 확인을 클릭하세요."와 같은 더 무서운 내용도 있습니다.

그런 다음 브라우저는 더욱 현명해졌고 사용자를 속이는 것을 더 어렵게 만들기 위해 도우미 텍스트를 추가하기 시작했습니다. 예를 들어, IE8이 이를 수행하는 방법은 다음과 같습니다:

거의 유사한 텍스트가 Firefox 3에 있었습니다.


다 읽어보면 사이트가 무엇을 보고했는지, 브라우저가 무엇을 보고했는지 명확해집니다. 그러나 여전히 속일 수 있습니다.

여기서는 버튼에서 직접 수행되는 작업에 대한 명확한 설명을 볼 수 있습니다. 사용자가 머물려면 '나가기'를 클릭하고 떠나려면 '숙박'을 클릭하도록 설득하는 것은 이미 상당히 어렵습니다. 제 생각에는 해결책이 이상적이며 이 주제는 종결될 수 있습니다. 일반적으로 아시다시피 거의 모든 대화 상자의 얼굴 없는 OK는 작업 이름으로 대체되어야 합니다(예: "파일 삭제", "검색", "줄 추가", "파일 열기" 등). 이렇게 하면 대화 텍스트를 완전히 제어할 수 있는 경우에도 사용자 오류 수가 줄어듭니다.

버그 641509가 나온 드라마는 무엇이었나요? 사실 Firefox 4 이상에서는 이 확인 내용이 다음과 같습니다.


본 것처럼, 맞춤 텍스트아예 사라졌습니다. 버전 4부터 웹사이트는 사용자에게 추가 메시지를 제공하거나 사용자가 떠나는 것을 구체적으로 원하지 않는 이유를 설명할 수 없습니다. 예를 들어, 하나의 창에서 많은 문서를 작업하기 위한 인터페이스를 구현하고 그 중 하나가 저장되지 않은 경우 구체적으로 어떤 문서인지 알 수 있지만 Firefox에서는 이를 이해하지 못할 것입니다. 어쩌면 저장하고 싶지 않을 수도 있고 메시지를 본다면 침착하게 페이지를 떠날 수도 있지만 그렇지 않으면 무슨 일이 일어나고 있는지 알 수 없습니다. 시트에