사용자가 브라우저/탭을 닫을 때만 beforeunload 호출하기

Question

내 웹 사이트/탭을 닫으려고 할 때 모든 양식이없는 한 사이트를 떠나지 말아야한다는 것을 내 페이지에 beforeunload 이벤트를 사용했습니다. 채우는. 하지만 문제는 내 페이지가 모든 섹션 양식을 채운 후에 다시로드되는 풍부한 양식을 갖고 있다는 것입니다.

의미 페이지에는 여러 가지 양식이 있으며 각각에는 고유 한 제출 버튼이 있습니다. 사용자가 하나의 form을 저장하면 페이지가 다시로드됩니다. 하지만 다시로드 할 때 beforeunload이 해고되고 "사용자는 웹 사이트를 떠나시겠습니까?"라고 묻습니다. 사용자는 웹 사이트를 떠나려하지 않고 방금 페이지를 다시로드했습니다.

요약하면 페이지 재로드시 beforeunload를 피하고 사용자가 탭이나 브라우저를 닫을 때만 호출하고 싶습니다. 그럴 수 있습니다.

나는 다음 코드를 시도했지만 그 작동하지 않았다 :

window.onbeforeunload = function(e) { 
    var e = e || window.event; 
    var target = e.target.URL; 

    if (target == "http://mywebsite.com/customerdetails") 
    { 
    return false; 
    } 
}; 

Answer 1

내가 한 번 같은 문제를했고 좋은 해결책을 가져올 수 없습니다. 내가 발견 한 해결 방법은 페이지를 다시로드하기 전에 onbeforeunload의 수신을 취소하는 것입니다. 페이지가 다시로드되면 첨부하십시오.

Answer 2

두 경우 모두 (제출 및 창 닫기) target은 동일합니다.

formSubmitted과 같은 "플래그"를 유지하고 false으로 설정하십시오. 양식을 제출하면 true으로 설정하십시오. formSubmitted이 false 또는 true 인 경우 onbeforeunload에서 확인하십시오. 이 같은

뭔가가 :

var formSubmitted = false; 

window.onbeforeunload = function(e) { 
    var e = e || window.event; 
    var target = e.target.URL; 

    if (!formSubmitted) 
    { 
    return false; 
    } 
}; 

<form action="/asdf" onsubmit="formSubmitted = true"> 
    <input type="text" name="test" /> 
    <button>Submit</button> 
</form> 

http://output.jsbin.com/hayahut

Answer 3

변수를 설정하면 클릭 VAR의 항해 = 사실 같은 탐색 버튼 중 하나; onbeforeunload 이벤트 핸들러가 탐색 중인지 확인합니다.