- PR -

aspxファイルでのonbeforeunloadイベントについて

1
投稿者投稿内容
さとし
会議室デビュー日: 2007/01/24
投稿数: 8
投稿日時: 2008-06-09 19:30
どなたか、ご教授願えませんでしょうか。

ページ移動やページを閉じるタイミングで、
警告を発したく、aspxファイルのheadに下記の
javascriptコードを入れました。
===========================
<script type="text/javascript"><!--
window.onbeforeunload = function() {
return "このページで作成したコースの情報が失われますがよろしいですか？";
}
// --></script>
===========================
aspxファイルは、ドロップダウンリストの選択に応じて
gridviewにレコードを表示させる様なページなのですが、
ドロップダウンリストを選択した際にも、
上記のonbeforeunloadイベントが呼び出されてしまいます。
（つまりページ内の操作をする度に警告メッセージが出る）
ページ内の操作では、警告が出ず、
ページ移動の時や、ウインドウを閉じる時のみ、
警告が出る様にする方法はありますでしょうか？




ぴあちゃん
ぬし
会議室デビュー日: 2008/02/07
投稿数: 287
投稿日時: 2008-06-09 21:40
イベントが発生したオブジェクト又はマウスカーソル位置の座標を見ればいけますよ。
座標がクライアント内ならフォーム関連でポストバックが発生するオブジェクトのどれか、
それ以外なら、リロード・右上×ボタン、ページバック、
null なら、右クリックメニュー
とか。
右クリックメニューは怪しいので確認して下さい。
kiyokura
ベテラン
会議室デビュー日: 2007/08/08
投稿数: 69
お住まい・勤務地: 岡山
投稿日時: 2008-06-10 00:51
ぴあちゃんさんの挙げられた方法も一つの手だと思いますが、画面内のボタンコントロールなどのイベントで画面遷移する等、画面内の要素の操作でも区別する必要がある場合があるのであれば、判定が煩雑になりそうにも思います。
（そういう要求があれば、の話ですが。）


Webではあまりこういった仕様を盛り込むのは避けたいところですが、どうしても避けられないようでしたら、オーソドックス（？）にフラグ操作で対応するのも手だと思います。
例えば、Javascriptでフラグを一つ用意しておき、そのフラグの内容でonbeforeunloadでの処理を変えるという方法です。


どのようにフラグを操作するかはケースバイケースと思いますが、例えばonSubmitで操作したり、直接コントロールのPostback発生のイベント（onChangeやonClick等）に対してフラグ操作を埋め込む等で行えば良いのではないかと思います。
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2008-06-10 06:33
下記サイトが参考になるかと・・・

http://forums.asp.net/t/1014977.aspx

コード:
<html>
<head>
  <title>onbeforeunload sample (IE, FX)</title>

  <script type="text/javascript">
var UNLOAD_MSG = "You will lose any unsaved changes!";

var IGNORE_UNLOAD = true;

function doBeforeUnload() {
   if(IGNORE_UNLOAD) return; // Let the page unload

   if(window.event)
      window.event.returnValue = UNLOAD_MSG; // IE
   else
      return UNLOAD_MSG; // FX
}

if(window.body)
   window.body.onbeforeunload = doBeforeUnload; // IE
else
   window.onbeforeunload = doBeforeUnload; // FX
  </script>

  <script type="text/javascript">
function SetTxtFocus(txtId) {
   var oTxt = document.getElementById(txtId);
   oTxt.focus();
   oTxt.select();
}
  </script>

</head>
<body onload="SetTxtFocus('MyText')">
  <form action="">
  <p>
    <input type="text" id="MyText" value="Change this to trigger" 
      onchange="IGNORE_UNLOAD = false"
      onkeypress="IGNORE_UNLOAD = false" /></p>
  <p>
    <input type="submit" value="Test submit" 
    onclick="IGNORE_UNLOAD = true" /></p>
  <p>
    <a href="http://www.google.com">Test jump</a></p>
  </form>
</body>
</html>

_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
Access
ぬし
会議室デビュー日: 2002/04/08
投稿数: 829
投稿日時: 2008-06-10 06:38
あと、ちょっと古いですが

http://aspnet.4guysfromrolla.com/articles/101304-1.aspx

にもサンプルがあります。
_________________
ASP.NET+Ajaxサンプル集 | JavaScript+Ajaxサンプル集
さとし
会議室デビュー日: 2007/01/24
投稿数: 8
投稿日時: 2008-06-11 13:30
ぴあちゃん様。kiyokura様。
非常に参考になりました。
Access様。
コードのご提示までしていただけて、
javascriptにうとい私にはなによりです。

皆様の返信を参考にして何とかいける様な気がしてきましたので、
頑張ってみます。

お手数おかけしました。
1

スキルアップ／キャリアアップ（JOB@IT）