jQuery 事件委托

2023-12-15

我需要一些有关回调的帮助。由于某种原因,它们的工作效果并不是很好。
我正在用 jQuery 制作一个游戏。我有一个<div id='button'></div>对于游戏中将出现的所有按钮。游戏将有两个执行操作的按钮,上面有一个问题。该问题由一个控制<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!');
        });
    });

我只是想知道..如何将回调函数设置为“战斗”和“离开”。
如果您想知道为什么一开始就有所有这些变量,那么这些只是图像和字符。


你不能设置一个click处理程序不存在的元素。你应该做的是使用.on将元素绑定到树的更上层。就像是:

$("#someparentelement").on("click", "#yes", function() {
    // your code
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery 事件委托 的相关文章