1

私は JQuery の を使用して$.dialog()おり、[OK] ボタンと [キャンセル] ボタンのあるダイアログを開きます。

ダイアログが開いたときにコードが停止し、ユーザーが [OK] または [キャンセル] を選択したときに最初に続行すると予想していました。

ここに私の完全なソースコードがあります http://pastebin.com/uw7bvtn7

問題があるセクションは 127 ～ 151 行目です。

$("#dialog:ui-dialog").dialog("destroy");

$("#dialog-confirm").dialog({
    resizable: false,
    height: 600,
    modal: true,
    open: function() {
    $(this).children('div.dialog-text').replaceWith("<h3><b>Users</b></h3>" + makeDialogTable(users) + "<h3><b>Owners</b></h3>" + makeDialogTable(owners));
    },
    
    buttons: {
    "Okay": function() {
        $(this).dialog("close");
    },
    
    Cancel: function() {
        is_okay = 0;
        $(this).dialog("close");
    }
    } // buttons
    
}); // dialog


alert(is_okay);

コードが現在行っていることは、最初にダイアログを表示し、次にalert(is_okay)上に表示することです。

私が望むのは、ユーザーが [OK] または [キャンセル] を押したときにコードが最初に続行されることです。

どうすればそれができますか？

4

9 に答える 9

3

「OK」および「キャンセル」ボタン機能に追加のコードを入れることができます。例えば：

"Okay": function() {
    $(this).dialog("close");
    alert(is_okay);
},
于 2011-05-17T14:05:33.797 に答える
2

それは「良い」方法で行うことはできません。また、そうしないことを強くお勧めします。

あなたが説明するのは、完全にブロックされたモーダル ウィンドウ/ダイアログです。これは、Web アプリケーションにとって素晴らしいものです。フラグを使用して既にダイアログを作成しているmodalため、ダイアログが開いている間、ユーザーはサイトで実際には何もできませんが、UI は応答性を保ちます。

繰り返しますが、コードの実行を「保留」する方法は実際にはありません。Javascript と UI の更新は同じスレッドを共有するため、その方向のアプローチはUI スレッドをフリーズさせます。

かなりの年月以来、開発者は Javascript をますますブロックしないように推し進めてきました (実際、ブラウザーの Javascript は常にその道をたどりましたが、これは非常に良いことです)。このアイデアは、バックエンドの nodeJS で生まれ変わりました。だから、あなたはここで上流に泳いでいます、それをしないでください。

そこで解決しようとする問題が何であれ、別の方法で考えてみてください。機能的に考え、コールバックとイベントを使用し、考えてみてください... ECMAscript! :p

于 2011-05-17T14:06:36.990 に答える
2

コードは順次実行されます。の仕事は$("#dialog-confirm").dialog()、ダイアログ ボックスをポップアップすることです。alert(is_okay)その上の行が実行されるまで実行されません。しかしOkay、 とCancelはイベント リスナーです。

"Okay": function() {
    $(this).dialog("close");
}

上記のコードは、イベント リスナーをイベントに割り当てます。これらの関数を実行するのではなく、それらの関数をイベント呼び出しに割り当てるだけです。

イベントとイベントリスナーについて読むことをお勧めします。JQuery を真剣に使用する場合は、混乱を避けることができます。

于 2011-05-17T14:16:47.630 に答える
1

ブラウザは、イベントベースの非同期プログラミング モデルを使用しており、多くのことが同時に発生する (および実行される) 場合があります。これがスタイル遷移 (ロールダウンやフェードなどのアニメーション) のしくみです。

あなたの例はダイアログを表示し、アラートをスローします。ユーザーがボタンをクリックするのを「待つ」ことはできません。

そのため、アクションに関連付けられたコールバック内で[OK] または [キャンセル] ボタンがクリックされたときに必要な処理を行うように、コードをリファクタリングする必要があります。

つまり、次のことを行う必要があります。

buttons: {
  "Okay": function() { // this function is called when a user clicks the Okay button
    // do whatever work is required here
  }
}
于 2011-05-17T14:10:22.360 に答える
1 
$("#dialog-confirm").dialog({  ... 
close :(event, ui) { alert(is_okay);}
})

または、後で関数をバインドできます。

$( "#dialog-confirm" ).bind( "dialogclose", function(event, ui) {
   alert(is_okay);
});

コードは のように停止して続行しませんがalert、ダイアログが閉じられたときにのみメッセージが表示されます。

于 2011-05-17T14:07:17.373 に答える
1

ダイアログを開いた後に続くすべてのコードを関数に入れ、ダイアログのコールバック関数からその関数を呼び出して、OK / キャンセルします。

function doTheRest(args) {
    alert(args);
}

// snippet from dialog options
"Okay": function() {
    $(this).dialog("close");
    doTheRest(1);
},

"Cancel": function() {
    $(this).dialog("close");
    doTheRest(0);
}
于 2011-05-17T14:07:50.157 に答える
0

このようなことを...

function MyAlert(Message, Title,FuncExecAfterOkPressed) {

$("<div>" + Message + "</div>").dialog({
    title: Title,
    dialogClass: "alert",
    width: "auto",
    modal:true,
    open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); },
    buttons: [
    {
        text: "Ok", click: function () {               
            $(this).dialog("close");
            if (FuncExecAfterOkPressed != null) {
                $.Callbacks().add(FuncExecAfterOkPressed).fire(null);
            }
        }
    }]
});

}

今、このように呼び出します

 MyAlert(data, "Duplicate", function () {
                            alert("I m moumit");
                            $("#Name").val("");
                        });

必要なものの 1 つは、JQueryUI プラグインです。お楽しみください。

于 2013-02-10T14:03:53.473 に答える
0

JavaScript で何かを「待機」する直接的な方法はありません。一般に、非同期イベントはコールバックによって処理されます。これは、プログラムを順次コードとしてではなく、イベントの観点から考える必要があることを意味します。現在のコードの代わりに:

$("#dialog-confirm").dialog({
  ...
});

alert(is_okay);
// rest of code

「残りのコード」セクションを独自の関数にラップし、ダイアログの OK/Cancel コールバックから呼び出す必要があります。

$("#dialog-confirm").dialog({
    ...

    buttons: {
    "Okay": function() {
        $(this).dialog("close");
        what_happens_if_okay();
    },

    Cancel: function() {
        $(this).dialog("close");
        what_happens_if_not_okay();
    }
    } // buttons

}); // dialog
于 2011-05-17T14:07:04.723 に答える