0

基本的に、オーバーレイを作成し、これを「読み込み画面」として appendTo に読み込みます。

最近、オーバーレイに停止ボタンを追加する必要がありましたが、これは問題ではありませんでしたが、jquery .click 関数がボタンのクリックを検出していません。既存のボタンを保持しようとしたため、登録される可能性がありますが、残念ながらそうではありません。

(ボタンにも Id を使用してみました。

以下は、問題を実証するためのテスト コードです。

$(document).ready(function(){
    $("#addButton").click( function () {
        $overlay = $("<div id='overlay'><div id='contain'><h3 style='color:#FFF'>Processing, just a moment</h3> <div id='stop'><button type='button' class='btn btn-primary' id='stop1' >Stop</button></div><div class='bar' style='width: 80%; padding-top:50%'></div></div></div");
        $overlay.appendTo(document.body);
        $("#stop").click( function() {
            alert("working");
        });
    });

編集:

明確にするために、これは私が最初に望んでいたことですが、「過度の変更」により、上記の例は私のシナリオで機能します。これは、明確にするために元の問題です。

    $(document).ready(function(){
        $("#addButton").click( function () {
            $overlay = $("<div id='overlay'><div id='contain'><h3 style='color:#FFF'>Processing, just a moment</h3> <div id='stop'><button type='button' class='btn btn-primary' id='stop1' >Stop</button></div><div class='bar' style='width: 80%; padding-top:50%'></div></div></div");
            $overlay.appendTo(document.body);

        });

$("#stop").click( function() {
                alert("working");
            });

});
4

3 に答える 3

1

はい、それもできます。メソッドのドキュメントをon()参照してください。

$(document).ready(function(){
    $("#addButton").click( function () {
        $overlay = $("<div id='overlay'><div id='contain'><h3 style='color:#FFF'>Processing, just a moment</h3> <div id='stop'><button type='button' class='btn btn-primary' id='stop1' >Stop</button></div><div class='bar' style='width: 80%; padding-top:50%'></div></div></div");
        $overlay.appendTo(document.body);
    });

    $(document).on("click", "#stop", function() {
        alert("working");
    });
});

#stopこれにより、要素からクリック イベントが発生するたびに起動するクリック リスナーが 1 つだけドキュメントに追加されます。ただし、これは通常、多くの要素に対してのみ必要なため、そのstopようなボタンが複数ある場合は、クラス " " を使用することをお勧めします。

それでも、正しい onclick-action を実行するには、最初の例で使用したクロージャーが必要になると思います。

于 2012-05-20T21:52:00.030 に答える
1
$(document).ready(function(){
    $("#addButton").on('click', function() {
        $overlay = $("<div id='overlay'><div id='contain'><h3 style='color:#FFF'>Processing, just a moment</h3> <div id='stop'><button type='button' class='btn btn-primary' id='stop1' >Stop</button></div><div class='bar' style='width: 80%; padding-top:50%'></div></div></div");
        $overlay.appendTo(document.body);
    });

    $(document).on('click', '#stop', function() {
        alert("working");
    });
});
于 2012-05-20T21:52:08.740 に答える
0

.live()新しく作成されたものが引き続きclickイベントを取得するように使用します。
http://jsfiddle.net/DerekL/2GCfD/

ここに画像の説明を入力

                   それは今働いています。

于 2012-05-20T21:57:30.480 に答える