2015-02-09 86 views
3

把你的圖片:你能使用JavaScript來檢測用戶是否關閉了瀏覽器選項卡嗎?關閉瀏覽器?或已經離開瀏覽器?

  • 用戶是在移動設備上,並正在尋找在一個瀏覽器(例如Safari在iPhone上)
  • 他們可以看到密碼字段,以創建一個密碼模式框
  • 如果用戶要關閉模式框並從瀏覽器中出來,我想向他們發送一封電子郵件以提示他們創建密碼。

我最初的想法是必須有某種java腳本事件才能夠做到這一點?

這樣你就可以檢測與JavaScript的一個地方用戶有下列用戶操作: - 關閉了一個標籤 - 關閉了瀏覽器 - 離開了他們的瀏覽器

+1

這也許? https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers.onbeforeunload – 2015-02-09 11:18:00

+0

這種「自動annoyer」應該重新考慮...... – 2015-02-09 11:20:36

+0

您可以隨時在用戶的瀏覽器中設置一個cookie記錄他們是否已經註冊。 – kontur 2015-02-09 11:22:26

回答

1

簡短的回答是不是真的,沒有。長的回答是有一個onunload事件,但你可以用它做的所有事情是詢問用戶他們是否確定他們想離開(參見@EvanKnowles的評論),但你不能附加任何複雜的邏輯。

最好的方法是有一些會話計時器,它會在您上次看到您的網站上次後N分鐘發送一封電子郵件。

+0

這個答案涵蓋了所有。這基本上不可能像你現在想要的那樣。除此之外,請不要這樣做。只需通過cookie或某個服務器端檢查(如果用戶嘗試登錄,但沒有密碼,顯示框),再次訪問模式框時再次顯示該模式框。不要發送電子郵件(或使用彈出窗口)。 – 2015-02-09 11:24:35

1

如果你的用戶關閉了一個標籤,你可以用onunload事件來檢測它,但是當她關閉瀏覽器時,你的javascript引擎也會中止,因此你不能再在客戶端運行任何類型的程序。

但是,您可以在服務器上檢測到它。例如,如果您準備了websocket連接,則可能會檢測到客戶端何時退出,然後執行所需的操作。

這個過程是這樣的:在進入頁面時,建立一個自動websocket連接到你的服務器。如果需要,可以在輸入電子郵件時閱讀電子郵件(也可以通過websocket事件將其發送到服務器),最後,當「disconnect」事件觸發時,將電子郵件發送到該地址。

如果您想以這種方式進行操作,您可能需要查看Socket.IO webpage,這對我來說是實現此過程的最簡單方法之一。

3

也在尋找問題,但你不會滿足需求。

我剛剛發現瞭如何解決這個問題:「您可以使用JavaScript來檢測用戶是否關閉了瀏覽器選項卡?關閉瀏覽器?或者已經離開瀏覽器?

<html> 
<head> 
<title>Detecting browser close</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script type="text/javascript"> 
var validNavigation = false; 

function wireUpEvents() { 
var dont_confirm_leave = 0; //set dont_confirm_leave to 1 when you want the user to be able to leave withou confirmation 
var leave_message = 'ServerThemes.Net Recommend BEST WEB HOSTING at new tab window. Good things will come to you' 
function goodbye(e) { 
if (!validNavigation) { 
window.open("http://serverthemes.net/best-web-hosting-services","_blank"); 
    return leave_message; 

} 
} 
window.onbeforeunload=goodbye; 

// Attach the event keypress to exclude the F5 refresh 
$(document).bind('keypress', function(e) { 
if (e.keyCode == 116){ 
    validNavigation = true; 
} 
}); 

// Attach the event click for all links in the page 
$("a").bind("click", function() { 
validNavigation = true; 
}); 
// Attach the event submit for all forms in the page 
$("form").bind("submit", function() { 
validNavigation = true; 
}); 

// Attach the event click for all inputs in the page 
$("input[type=submit]").bind("click", function() { 
validNavigation = true; 
}); 

} 

// Wire up the events as soon as the DOM tree is ready 
$(document).ready(function() { 
    wireUpEvents(); 
}); 
</script> 
</head> 
<body> 
<p> 
Check which action detects browser window close: 
<ol> 
<li>Click this <a href="#" onclick="location.reload();return false">Refresh</a> link or the browser's Refresh button</li> 
<li>Navigate away from this page through a <a href="http://serverthemes.net/">link</a></li> 
<li>Type another URL in the address bar</li> 
<li>Click Back or Forward button</li> 
<li>Click the Close (X) button in the top-rightmost corner of the browser</li> 
<li>Click the IE icon in the top-leftmost corner and choose Close. Or simply double-click the icon</li> 
<li>Press Alt+F4 key</li> 
</ol> 
</p> 
    <p>In IE, the last 3 actions are correctly detected by the <a href="#" onclick="alert(doUnload);return false">javascript code</a> inside this page as browser close.</p> 
    </body> 
    </html> 
+0

是否與Alt-F4相同,並關閉導航器(選項卡或X)以及F5鍵,回發並重新加載? – Kiquenet 2015-07-08 10:37:01

+0

此解決方案是否也適用於移動瀏覽器?我對此表示懷疑。 – Black 2016-04-12 11:45:51