เทคนิค ใช้ event beforeunload แจ้งเตือนก่อน ปิดบราวเซอร์ ด้วย jQuery

ตัวอย่างโค้ดด้านล่าง เป็นการประยุกต์ใช้ event ชื่อ beforeunload สำหรับการแจ้งเตือนการปิด บราวเซอร์ โดยเมื่อทำการยืนยันการปิดบราวเซอร์ แล้วให้สามารถไปทำงานในส่วน เรียกใช้ ajax หรือฟังก์ชันที่ต้องการก่อนปิด ได้ (ทดสอบกับ IE Firefox Chrome เวอร์ล่าสุดใช้งานได้)

 

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
	$(window).bind("beforeunload",function(event){
		var msg="ยืนยันการปิดหน้านี้?";
		$(window).bind("unload",function(event){
			event.stopImmediatePropagation();
			// แทรก ajax code ลบ session หรืออื่น ๆ
			alert("Bye Bye");
		});
		return msg;
	});
	$("a").click(function(){ // กรณีคลิกลิ้งค์ ไม่ต้องแสดง การแจ้งเตือน
		$(window).unbind("beforeunload");
	});
});
</script>

ตัวอย่าง

ทดสอบด้วยการปิดหน้าเว็บเพจนี้