3

ユーザーがフォーム フィールドでいくつかの変更を行うことを許可し、ユーザーが変更を行ったかどうかに基づいて、[変更を送信] ボタンを有効にしました。

ユーザーが行った変更を送信せずに、他のページに移動することをユーザーに確認する機能を追加したいと考えています。ダイアログ ボックスを表示するコードを追加しましたが、問題は、ダイアログ ボックスが短時間表示された後、ページ ナビゲーションが別のページに移動することです。私のコードは次のとおりです。

        window.onbeforeunload = function() {
            if(!dijit.byId('editBtn').get('disabled')) {
                discardChanges(
                        'Pending Unsaved Changes',
                        'You have pending unsaved changes. Do you really want to discard them?',
                        'Discard Changes',
                        function() {
                            return true;
                        },
                        function() {
                            return false;
                        },
                        300,
                        700);
            }
        }

ブラウザが他のページに移動するのを止めて、ユーザーがダイアログ ボックスのボタンをクリックするのを待ってから、クリックを破棄するかどうかを決定するにはどうすればよいですか。ダイアログ ボックスは次のようになります。

ここに画像の説明を入力

4

3 に答える 3

5

ページがアンロードされたときに発生するイベントwindow.onbeforeunloadを使用し、文字列「保存されていない保留中の変更があります。本当に破棄しますか?」を返します。

ブラウザにネイティブ ダイアログが表示されます。

ここに画像の説明を入力

これは、ナビゲーションを停止する唯一の方法です。

jsFiddle: http://jsfiddle.net/phusick/R6EJ3/show/light/

于 2012-09-10T11:58:05.810 に答える
0

更新 (2013)

元の回答は IE6-8 と FX1-3.5 に適しています (2009 年に作成されたときにターゲットとしていたものです)。以下、参考までに。

window.onbeforeunload は、すべてのブラウザーで一貫して処理されるわけではありません。これは文字列ではなく関数参照である必要があります（元の回答が述べたように）が、古いブラウザでも機能します。それらのほとんどのチェックは、 onbeforeunload に何かが割り当てられているかどうか（nullを返す関数を含む）であるように見えるためです。

window.onbeforeunload を関数参照に設定しますが、古いブラウザーでは、文字列を返すだけでなく、イベントの returnValue を設定する必要があります。

var confirmOnPageExit = function (e) 
{
    // If we haven't been passed the event get the window.event
    e = e || window.event;

    var message = 'Any text will block the navigation and display a prompt';

    // For IE6-8 and Firefox prior to version 4
    if (e) 
    {
        e.returnValue = message;
    }

    // For Chrome, Safari, IE8+ and Opera 12+
    return message;
};

ユーザーにメッセージなしで続行させたい場合は、confirmOnPageExit でチェックを実行して null を返すことはできません。確実にオンとオフを切り替えるには、イベントを削除する必要があります。

// オンにします - 文字列を返す関数を割り当てます

window.onbeforeunload = confirmOnPageExit;

// オフにします - 関数を完全に削除します

window.onbeforeunload = null;

元の回答（2009年に働いた）

スイッチを入れるには：

window.onbeforeunload = "Are you sure you want to leave?";

オフにするには:

window.onbeforeunload = null;

これは通常のイベントではないことに注意してください。標準的な方法ではバインドできません。

値を確認するには？それは検証フレームワークによって異なります。

jQuery では、これは次のようになります (非常に基本的な例)。

$('input').change(function() {
    if( $(this).val() != "" )
        window.onbeforeunload = "Are you sure you want to leave?";
});

元は

于 2016-05-26T11:57:47.610 に答える