特定の要素の onbeforeunload をオーバーライドできますか?

StackOverflow https://stackoverflow.com/questions/57791

  •  09-06-2019
  •  | 
  •  

質問

かなりの作業を行うページがあり、警告が表示されずにユーザーがそのページから移動できるようにしたくありません（ブラウザを閉じる、戻るボタンを押すなど）。onbeforeunload イベント (これは IE 固有のものだと思いますが、プロジェクトでは ActiveX が大量に使用されているため、私にとってはうまく機能します) がうまく機能することがわかりました。

問題は、ユーザーがいつでも右上隅にある小さな「ヘルプ」アイコンをクリックしてヘルプ ウィンドウをポップアップできるようにしたいことです。これにより、メイン ウィンドウがどこにも移動せず、ページがアンロードされない場合でも、onbeforeunload が起動されます。

onbeforeunload イベントの実行時に実行される JavaScript 関数は、event.returnValue にテキストを挿入するだけです。クリックされたアイコンがヘルプ アイコンであることを何らかの方法で確認できた場合、その状況では、event.returnValue にテキストを入力することはできません。しかし、どうすればページにそれを認識させることができるでしょうか?

役に立ちましたか？

解決

私に当てさせてください：ヘルプの「アイコン」は実際には javascript: URL?これを実際のボタンまたは実際のリンクに変更するか、少なくともその機能を onclick イベント ハンドラーに組み込みます (デフォルトの動作を防止します)。問題が解決しました。

<!-- clicking this link will do nothing. No onbeforeunload handler triggered. 
Nothing. 
And you could put something in before the return false bit...
...and the onunload handler would still not get called... -->
<a href="http://www.google.com/" onclick="return false;">blah1</a>
<!-- this should also do nothing, but IE will trigger the onbeforeunload 
handler -->
<a href="javascript:void(0)">blah2</a>

他のヒント

編集： 私の理解不足に基づく、以下の「回避策」は完全にやりすぎです。上記の Shog9 の回答に従ってください。

さて、質問を書いているときに、現時点では機能する回避策を思いつきました。

アイコンがホバーされているかどうかに関するブール値として機能するグローバル JavaScript 変数を配置しました。次に、画像の onmouseover イベントと onmouseout イベントにイベントをアタッチし、この値を設定する関数を作成します。最後に、evenbeforeunload を処理する関数をコーディングして、event.returnValue を設定する前にこの値をチェックします。

おそらく完璧な回避策ではありませんが、今のところは機能します。

インターネット上では、次のようなものを使用することを提案している人がたくさんいます。

window.onbeforeunload = null

しかし、これはIE6では機能しません。イベント オブジェクトの MSDN ドキュメントを読んでいると、event.cancelBubble プロパティへの参照が見つかり、これが解決策だと思いました。しかし、「event.cancelBubble=true」の設定は役に立たないことを指摘した Orso のおかげで、確認プロンプトを取り除く方法は return ステートメントを完全に除外することです。私は、ブール変数をフラグとして使用するかどうかを決定することにしました。何かを返すか返さないか。以下の例では、背後のコードにプログラム的に JavaScript コードを追加します。

Page.ClientScript.RegisterStartupScript(typeof(String), "ConfirmClose", @"  <script>        window.onbeforeunload = confirmExit;        function confirmExit()      {           if(postback == false)               return ""Please don't leave this page without clicking the 'Save Changes' or 'Discard Changes' buttons."";                                                      }       </script>");

この場合、ヘルプ ボタンには次の aspx マークアップが含まれます。

OnClientClick="postback=true;return true;

これにより、'postback' 変数が true に設定され、conformExit() 関数で取得され、イベントがキャンセルされます。

これがお役に立てば幸いです。IE6 および FF 1.5.0.2 でテストされ、動作します。

少し不格好な方法がありますが、ほとんどの場合は機能します。

1 つの 100% 単一 FRAME を持つ FRAMESET を含む「Holding」ポップアップ ページを作成し、通常の onUnload および onbeforeUnload イベント ハンドラーを HEAD に配置します。

<html>
<head>
<script language="Javascript" type="text/javascript">
  window.onbeforeunload = exitCheck;
  window.onunload = onCloseDoSomething;

  function onCloseDoSomething()
  {
  alert("This is executed at unload");
  }

  function exitCheck(evt)
  {
  return "Any string here."}
  </script>
  </head>

    <frameset rows="100%">
    <FRAME name="main" src="http://www.yourDomain.com/yourActualPage.aspx">
    </frameset>
<body>
</body>
</html>

この方法を使用すると、外側のフレームの onUnload または onbeforeUnload イベントが発生することなく、表示したい実際のページを自由に使用したり、ポストバックしたり、ハイパーリンクをクリックしたりすることができます。

外側のフレームが更新されるか、実際に閉じられると、イベントが発生します。

先ほども言いましたが、完全に保証されるわけではありませんが、クリックまたはポストバックごとにイベントの発生を回避します。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top