Cách gọi hàm trước khi rời trang bằng Javascript

Question

Tôi muốn thực thi chức năng trước khi rời khỏi trang mà không hiển thị cửa sổ bật lên xác nhận chỉ với Javascript. Tôi đã thử với các mã dưới đây nhưng nó đã không làm việc hoặc với onbeforeunload nhưng nó luôn luôn cho thấy popup.

var result = 'test'; 

if(window.onbeforeunload == true) 
{ 
    result = 'test1'; 
    alertmess(); 
} 

function alertmess() { 
    alert(result); 
} 

//window.onbeforeunload = function() { 
// return result; 
//} 

Answer 1

Bạn luôn có thể gọi chức năng của bạn trước khi rời khỏi trang.

function myfun(){ 
    // Write your business logic here 
    console.log('hello'); 
} 

onbeforeunload:

window.onbeforeunload = function(){ 
    myfun(); 
    return 'Are you sure you want to leave?'; 
}; 

Hoặc với jQuery:

$(window).bind('beforeunload', function(){ 
    myfun(); 
    return 'Are you sure you want to leave?'; 
}); 

này chỉ sẽ hỏi người dùng nếu họ muốn rời khỏi trang hay không, bạn không thể chuyển hướng họ nếu họ chọn để ở lại trên trang. Nếu họ chọn rời khỏi, trình duyệt sẽ chuyển đến nơi họ yêu cầu.

Bạn có thể sử dụng onunload để làm công cụ trước khi trang được bốc dỡ, nhưng bạn không thể chuyển hướng từ đó (khối Chrome 14 + cảnh báo bên onunload):

window.onunload = function() { 
    myfun(); 
    alert('Bye.'); 
} 

Hoặc với jQuery:

$(window).unload(function(){ 
    myfun(); 
    alert('Bye.'); 
}); 

Answer 2

Điều bạn đang làm chắc chắn sẽ không thực hiện được. So sánh window.onbeforeunload đến true tại một số thời điểm tùy ý thậm chí không có ý nghĩa.

Có gì với mã nhận xét ở cuối? Nếu bất cứ điều gì, bạn cần phải gán một chức năng để onbeforeunload:

var result = 'test'; 

window.onbeforeunload = function() { 
    result = 'test1'; 
    alertmess(); 
} 

function alertmess() { 
    alert(result); 
} 

Tuy nhiên, ở trên chỉ xuất hiện để làm việc trong IE. Vui lòng xem nhận xét của @ Bulk và câu trả lời của @Brandon Gano.

Answer 3

Nếu bạn muốn nhắc người dùng, hãy trả về một chuỗi có thư. Nếu bạn không muốn nhắc người dùng, đừng trả lại bất cứ điều gì.

// Execute code, then prompt the user to stay 
window.onbeforeunload = function() { 
    // This will happen before leaving the page 
    return 'Are you sure you want to leave?'; 
} 

Hoặc:

// Execute code, then leave 
window.onbeforeunload = function() { 
    // This will happen before leaving the page 
} 

Answer 4

Đây là một ví dụ về cách bạn có thể xử lý các điều hướng đi. Lưu ý cách div xuất hiện một chút trước khi điều hướng xảy ra.

window.onbeforeunload = function() 
 
{ 
 
    $("#oi").append($('<div>This is the child DIV</div>')); 
 
    
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="theMainDiv"> 
 
    The Main Div will receive another div before leaving the page 
 
</div> 
 

 
<button onclick="window.location.href='pageAway'">Navigate Away</button>

Answer 5

Chỉ cần gọi chức năng của bạn từ trong phạm vi window.onbeforeunload. Lưu ý, một số trình duyệt hạn chế những gì bạn có thể làm ở đây (ví dụ: không có chuyển hướng hoặc cảnh báo). Xem: https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload để biết thêm thông tin.

Tôi cũng đã thêm mã thích hợp cho người đọc rằng làm muốn hiển thị hộp thoại xác nhận.

function doSomething(){ 
    //do some stuff here. eg: 
    document.getElementById("test").innerHTML="Goodbye!"; 
} 
function showADialog(e){ 
    var confirmationMessage = 'Your message here'; 
    //some of the older browsers require you to set the return value of the event 
    (e || window.event).returnValue = confirmationMessage;  // Gecko and Trident 
    return confirmationMessage;        // Gecko and WebKit 
} 
window.addEventListener("beforeunload", function (e) { 
    //To do something (Remember, redirects or alerts are blocked here by most browsers): 
    doSomething();  
    //To show a dialog (uncomment to test): 
    //return showADialog(e); 
}); 

Chỉ cần nhấn 'Run' để kiểm tra: http://jsfiddle.net/2Lv4pa9p/1/

Answer 6

Các tài liệu ở đây khuyến khích nghe sự kiện onbeforeunload và/hoặc thêm một người biết lắng nghe sự kiện trên cửa sổ.

window.addEventListener('onbeforeunload', function(e) {}, false); 

Bạn cũng có thể chỉ cư trú trong .onunload hoặc .onbeforeunload thuộc tính của window với một chức năng hoặc một tham chiếu chức năng.

Mặc dù hành vi không được chuẩn hóa trên các trình duyệt, nhưng hàm này có thể trả về một giá trị mà trình duyệt sẽ hiển thị khi xác nhận có rời khỏi trang hay không.

Answer 7

Vui lòng thử bên dưới mã đơn giản -

Jquery Mã Ví dụ -

$(window).bind('beforeunload', function(){ 
    Func_ToInsert_Record(); 
    Alert('Thanks And Bye!'); 
}); 

Javascript Mã Ví dụ -

// Anonymous function 
window.onbeforeunload = function(event) { 
    var message = ''; 
    if (window.event) { 
    console.log(window.event); 
    console.log(event.currentTarget.performance); 
    console.log(event.currentTarget.performance.navigation); 
    console.log(event.currentTarget.performance.navigation.type); 

    } 

    event = event || window.event; 
    event.preventDefault = true; 
    event.cancelBubble = true; 
    event.returnValue = message; 
} 

Answer 8

tôi đơn giản đặt mã này và các công trình Preety cũng

window.onbeforeunload = function(event) { 
    $('element').show(); 
    return; 
};