1

コールバックについて助けが必要です。何らかの理由で、それらはうまく機能しません。
jQueryでゲームを作っています。ゲーム内に<div id='button'></div>配置されるすべてのボタンの があります。ゲームには、アクションを実行する 2 つのボタンと、その上にある質問があります。質問は によって制御されます<h3 id='text'></h3>。私が知りたいのは、何らかの理由でコールバック関数をボタンの ID に設定できないということです。たとえば、次のように jQuery を介して独自の ID が設定されている「はい」または「いいえ」があります。

$('#button').html('<button id='yes'>Yes</button><button id='no'></button>');
しかし、何らかの理由で、これを設定することができます:

$('yes').click(function(){
  //function I would want
});

もちろん、それは私のコードにあるものではありません。これは単なる例です。実際のコードは次のとおりです。

$(document).ready(function(){
    $('#main,#batman,#car,#cop,#hobo,#knife,#gangfight,#ganggun,#gangknife,#blood,#hr').hide(-100);
    var hr=$('#hr');
    var main=$('#main');
    var batman=$('#batman');
    var car=$('#car');
    var hobo=$('#hobo');
    var cop=$('#cop');
    var knife=$('#knife');
    var gangfight=$('#gangfight');
    var ganggun=$('#ganggun');
    var gangknife=$('#gangknife');
    var blood=$('#blood');
    var text=$('#text');
    var button=$('#button');
    $('#start').html('Are you ready to play?');
    $('#button').html('<button id="yes">Yes</button><button id="no">No</button>');
        $('#yes').click(function(){
            $('#yes,#no').hide(function(){
                $('#start').hide();
                main.fadeIn(-100);
                hr.fadeIn(-100,function(){
                text.delay(1000).html("You were just wandering around in the streets of new york, when suddenly.. You see batman!! You've never really liked him, what do you do?")
                    button.html('<button id="fight">Fight</button><button id="leave">Leave</button>',function(){
                        batman.fadeIn(1000);
                        $('fight').click(function(){
                        });
                        $('leave').click(function(){
                            text.fadeOut(function(){
                                text.text('Good call. As you leave, you encounter a hobo. What do you do?');
                            });
                        });
                    });
                });
            });
        });
        $('#no').click(function(){
            $('#yes,#no').hide();
            $('#start').text('Oh, okay then. Come back later!');
        });
    });

私はちょうど疑問に思っています..コールバック関数を「戦い」と「去る」に設定するにはどうすればよいですか。
なぜ最初にこれらすべての変数があるのか​​ 疑問に思っている場合、それらは単なる画像と文字です.

4

4 に答える 4

3

click存在しない要素にハンドラーを設定することはできません。あなたがすべきことは.on、要素をツリーのさらに上にバインドするために使用することです。何かのようなもの:

$("#someparentelement").on("click", "#yes", function() {
    // your code
});
于 2013-02-04T01:54:29.863 に答える
1

どのバージョンの jQuery を使用していますか? ボタンが DOM で実際に使用可能になる前にクリック ハンドラー コードが実行される可能性があるため、この状況ではおそらく jQuery.on() を使用する必要があります。

$("#button").on("click", "#yes", function (event) {
    // Your yes-button logic comes here.
});

詳細と可能性については、 jQuery ドキュメント.on(events [, selector ] [, data ], handler(eventObject))のメソッドについてお読みください。

セレクターが省略されているか null の場合、イベント ハンドラーは直接または直接バインドされていると見なされます。ハンドラーは、選択した要素でイベントが発生するたびに呼び出されます。イベントが要素で直接発生するか、子孫 (内部) 要素から発生するかは関係ありません。

セレクターが提供されている場合、イベント ハンドラーは委任されていると見なされます。イベントがバインドされた要素で直接発生した場合、ハンドラーは呼び出されませんが、セレクターに一致する子孫 (内部要素) に対してのみ呼び出されます。jQuery は、イベント ターゲットからハンドラーがアタッチされている要素 (つまり、最も内側の要素から最も外側の要素) までイベントをバブルし、セレクターに一致するそのパスに沿ったすべての要素に対してハンドラーを実行します。

この場合、delegateイベントをバインドしているときに要素がまだ DOM で使用できないため、イベントが必要です。

于 2013-02-04T01:54:12.657 に答える
0

$('fight') は、ファイト ID を持つタグではなく、ファイト タグを選択します。代わりに $('#fight') を使用してみてください。

于 2013-02-04T01:56:22.980 に答える
0

を使用せずclick()、使用on('click')して文書に添付してください。

この方法でハンドラーを作成すると、新しい要素がイベントをトリガーできるようになります。

于 2013-02-04T01:54:11.380 に答える