最速インターフェース研究会 :: history.backが成功したかどうかを判別する

Sep 01, 2006

history.backが成功したかどうかを判別する

function try_back(errback){
    var bs = false;
    Event.observe(window,"unload",function(){bs=true});
    Event.observe(window,"beforeunload",function(){bs=true});
    history.back();
    switch(typeof errback){
        case "function": setTimeout(function(){if(!bs) errback()},100);break;
        case "string"  : setTimeout(function(){if(!bs) location.href=errback},100);break;
    }
    return bs;
}
// 使い方
// 戻るに失敗したときの処理
try_back(function(){window.status="戻る失敗"});
// もしくは戻るに失敗したときにジャンプするURL
try_back("http://example.com");

Event.observeは使ってるライブラリに合わせて適当に書き換えてください。
IEやFirefoxだとhistory.backを実行した後、即座にwindow.onbeforeunloadが実行されるみたいです。Operaはonbeforeunloadが実装されてないのでunloadでも使えるようにしてあります。

window.onbeforeunloadはページから立ち去ってよろしいですか？とメッセージを出すのに使ったりするイベントハンドラ。Google Spreadsheetsなんかで使われてますね。

Posted at 18:25 | WriteBacks (3) | Edit

Edit this entry...

wikieditish message: Ready to edit this entry.

Title:

Body:

そんなわけなのでhistory.backを実行後にページ移動が発生しているかどうかを監視して、戻るに失敗したときに特定の処理を発生させることができるような関数を作ってみました。

<pre class="code">
function try_back(errback){
	var bs = false;
	Event.observe(window,"unload",function(){bs=true});
	Event.observe(window,"beforeunload",function(){bs=true});
	history.back();
	switch(typeof errback){
		case "function": setTimeout(function(){if(!bs) errback()},100);break;
		case "string"  : setTimeout(function(){if(!bs) location.href=errback},100);break;
	}
	return bs;
}
// 使い方
// 戻るに失敗したときの処理
try_back(function(){window.status="戻る失敗"});
// もしくは戻るに失敗したときにジャンプするURL
try_back("http://example.com");
</pre>

window.onbeforeunloadはページから立ち去ってよろしいですか？とメッセージを出すのに使ったりするイベントハンドラ。Google Spreadsheetsなんかで使われてますね。

Excerpt:

今も昔も大変よく使われている古典的JavaScriptの一つjavascript:history.back()なんですが、実際に戻る操作が成功したのかどうかを判別することができません。タブブラウザなんかを使っててミドルクリックで新規タブで開いてたりすると、history.backをクリックしても無反応で何も起こらない、なんてことよくありませんか？そんなわけなのでhistory.backを実行後にページ移動が発生しているかどうかを監視して、戻るに失敗したときに特定の処理を発生させることができるような関数を作ってみました。function try_back(errback){    var bs = false;    Event.observe(window,"unload",function(){bs=true});    Event.observe(window,"beforeunload",function(){bs=true});    history.back();    switch(typeof errback){        case "function": setTimeout(function(){if(!bs) errback()},100);break;        case "string"  : setTimeout(function(){if(!bs) location.href=errback},100);break;    }    return bs;}// 使い方// 戻るに失敗したときの処理try_back(function(){window.status="戻る失敗"});// もしくは戻るに失敗したときにジャンプするURLtry_back("http://example.com");Event.observeは使ってるライブラリに合わせて適当に書き換えてください。IEやFirefoxだとhistory.backを実行した後、即座にwindow.onbeforeunloadが実行されるみたいです。Operaはonbeforeunloadが実装されてないのでunloadでも使えるようにしてあります。window.onbeforeunloadはページから立ち去ってよろしいですか？とメッセージを出すのに使ったりするイベントハンドラ。Google Spreadsheetsなんかで使われてますね。

Ping URLs:

Password:

A quick preview will be rendered here when you click "Preview" button.