5

カスタム ポップアップを作成するための JavaScript クラス (jQuery を使用) を開発していますが、スクリプトを「一時停止」してユーザーの応答を待つ方法がわかりません ([OK] ボタンをクリックするか、キャンセルします)。

クラスは次のようになります。

function Popup()
{
}

Popup.Show = function(text)
{
    var _response;
    /* code to draw the popup elements*/

    $("#button-ok").on("click",function()
    {
        _response = "ok!"
    }

    return _response
}

たとえば、アラートで使用すると、ユーザーのクリックを待たないため、メソッドは常に「未定義」を返します。

alert(Popup.Show("hello"))
//return undefined before the popup appears

次のような while ループを使用しようとしました。

Popup.Show = function(text)
{
    var _response;
    var _wait = true;

    /* code to draw the window */

    $("#button-ok").on("click",function()
    {
        _wait = false;
        _response = "ok!"
    }

    while(_wait){};

    return _response
}

しかし、機能しません(私が期待したように)

では、ユーザーのクリックを待つにはどうすればよいでしょうか。

ありがとうございます

4

3 に答える 3

1

JavaScript は非同期です。実行を「一時停止」することはできません。さらに、javascript の実行中はユーザー インターフェイス全体がフリーズするため、ユーザーはボタンをクリックできません。

クリック イベントへのコールバックを登録すると、プログラムは実行を継続します。スクリプトの次の行

    _wait = false;
    _response = "ok!"

Popup.Show関数が戻るまで実行されません。おそらく、javascript イベント プログラミングに関するこの Nettuts の記事は、パラダイムを理解するのに役立つでしょう。

コードを修正する試みは次のとおりです。

Popup.Show = function(text)
{
  /* code to draw the window */

  // bind click event
  var myPopup = this;
  $("#button-ok").on("click",function()
  {
    // this code will be executed after Popup.Show has return
    myPopup.response = "ok!"
    myPopup.Close();
  }
}
于 2013-10-22T05:20:31.790 に答える
0

これは典型的な JavaScript の問題です。

$("#button-ok").on("click",function()
{
    _response = "ok!"
}

return _response

ここで何が起こるか見てみましょう。ボタンに onClick リスナーを設定し、そのイベントにコールバック関数を割り当てます。その関数は、別の関数に渡す引数と考えてください。直接実行されません。

while(_wait){};のようなものを使用して同期を強制的に実行する代わりに 、そのコールバックを使用する必要があります。

 Popup.Show = function(text)
 {

    $("#button-ok").on("click",function()
    {
           drawSomething('ok');
    }

 };

var drawSomthing = function(response) {
 // do something
 };

これはコールバックへの良いスタートです: http://javascriptissexy.com/

于 2013-10-22T05:13:44.913 に答える
0

「アラート」機能を再構築しようとしているように見えるため、何をしようとしているのか、その理由は少し漠然としています。ただし、「アラート」はブラウザによって設定されるウィンドウ関数です。この質問は、 Alert() 関数のようにページの実行を停止する の複製のようです

これは基本的に、機能をカプセル化して実行順序を強制できるコールバック チェーンについて説明しています。また、コードの実行方法について根本的な誤解があると思います。説明したように、イベント ハンドラーは非同期であり、コードが順番に読み取られる間、そのイベントがトリガーされるまで、イベント ハンドラー コールバック内で設定された関数を実行しません。

于 2017-04-08T00:04:02.637 に答える