2013-03-07 15 views
5

Pencereyi düzgün bir şekilde tetiklemem gerekir. Kullanıcının pencereyi gezdirdiğini (kapattığını) ve kaydedilmemiş herhangi bir çalışmanın silineceğini sağlamak için bir onay kutusu görüntülenir.window.onbeforeunload tetiklendiğinde bir bağlantının tıklanıp tıklanmadığını nasıl tespit edilir?

Bir kullanıcının bir bağlantıyı tıklatarak sayfadan ayrılırsa bunu tetiklemesini istemediğim benzersiz bir durum var, ancak işlev içinde bir bağlantının tıklanıp tıklanmadığını nasıl anlayacağımı anlayamıyorum işlevi durdurmak için. Sen ertelenen olay işleme aradığınız

window.onbeforeunload = function() { 
var message = 'You are leaving the page.'; 

/* If this is Firefox */ 
if(/Firefox[\/\s](\d+)/.test(navigator.userAgent) && new Number(RegExp.$1) >= 4) { 
    if(confirm(message)) { 
    history.go(); 
    } 
    else { 
    window.setTimeout(function() { 
     window.stop(); 
    }, 1); 
    } 
} 
/* Everything else */ 
else { 
    return message; 
} 
} 

cevap

6

: Bu kod için ne var. Daha az kod olduğu gibi, jQuery kullanarak açıklayacağız:

window._link_was_clicked = false; 
window.onbeforeunload = function(event) { 
    if (window._link_was_clicked) { 
    return; // abort beforeunload 
    } 
    // your event handling 
}; 

jQuery(document).on('click', 'a', function(event) { 
    window._link_was_clicked = true; 
}); 

gibi jQuery'nin uygun heyeti kullanım olmadan (çok) kötü adamın uygulama görünebilir:

document.addEventListener("click", function(event) { 
    if (this.nodeName.toLowerCase() === 'a') { 
    window._link_was_clicked = true; 
    } 
}, true); 

bu konuda tüm bağlantıları verir sayfanız beforeunload işleyicisini çağırmadan çıkacak. Bunun nasıl özelleştirileceğini anlayabileceğine eminim, sadece belirli bir bağlantılar dizisine izin vermeniz gerekiyorsa (sorunuz bu konuda özellikle açık değildi).

+0

Bu cevap için harika sayesinde. Bunu jQuery olmadan kullanmaya çalışıyorum - ve fakirlerin uygulamalarını nasıl bütünleştireceğimi anlamaya çalışıyorum ama bunu anlayamıyorum (beni affet, ben bir JS newb'im). – mirin

+0

Kodunuz yarı sağdı. Soruyu tam cevapla yanıtladı. – mirin

+0

Herhangi biri sorunu IE'de çalıştırıyorsa, null yerine undefined dönmek zorunda kaldım. Hem krom hem de kromda çalışır. – Janspeed

3
var link_was_clicked = false; 
document.addEventListener("click", function(e) { 
    if (e.target.nodeName.toLowerCase() === 'a') { 
    link_was_clicked = true; 
    } 
}, true); 

window.onbeforeunload = function() { 
    if(link_was_clicked) { 
    link_was_clicked = false; 
    return; 
    } 
    //other code here 
} 
1

Bir zamanlayıcı kullanarak bir link unload veya reload/user entering a different address unload s arasında farklılık gösterebilir. Bu şekilde, beforeunload'un bağlantı tıklatıldıktan hemen sonra tetiklendiğini biliyorsunuz. jQuery kullanarak

Örnek: (Chrome'da test)

$('a').on('click', function(){ 
    window.last_clicked_time = new Date().getTime(); 
    window.last_clicked = $(this); 
}); 

$(window).bind('beforeunload', function() { 
    var time_now = new Date().getTime(); 
    var link_clicked = window.last_clicked != undefined; 
    var within_click_offset = (time_now - window.last_clicked_time) < 100; 

    if (link_clicked && within_click_offset) { 
    return 'You clicked a link to '+window.last_clicked[0].href+'!'; 
    } else { 
    return 'You are leaving or reloading the page!'; 
    } 
}); 

İlgili konular