代码之家 › 专栏 › 技术社区 › JoeM05

jquery click事件没有触发…但是如果我在它里面放了一个警报框…?事件冒泡问题?

alert click events jquery

JoeM05 · 技术社区 · 16 年前

这是个奇怪的问题。

我有两个html弹出窗口,只是隐藏的div,我通过删除css类使其可见。一个是从主页启动的,第二个是从我设置为可见的div启动的。这一切都很好。当我试图关闭它们时,我会这样做: (来自游戏)_用户界面.js)

   setUpPopUp: function() {
       $(pop_up+" a").click(function(event) {
         event.stopPropagation();
         event.preventDefault();
         var el = event.target;
         if($(el).attr('href') == '#close') {
             $(pop_up).addClass('hidden');
             if(pop_up === pop_ups[1]) {
                 pop_up = pop_ups[0];
             }
         }
       });
   },

            ...

  setUpPopUp: function() {
                alert(pop_up);//it could be 'alert anything...'
                $(pop_up+" a").click(function(event) {
                   ...

它确实有用。为什么当我把一个警报框放进去的时候,这个突然就起作用了?你知道我的问题是什么,怎么解决吗?

(来自商店.js)

    var setUpDetail = function(id, item) {
    $('#pop-up').load('html_elements/shop.html #gameShopItem', function() {
        $('#gameShopItem h3').append(item.name+" Description");
        $('#gameShopItem p.itemDesc').append(item.description);
        $('#gameShopItem p.itemEffect').append(item.effect);            
        gameUi.setPopUpReference(0);                
        gameUi.showPopUp();
        gameUi.setUpPopUp();
        $("#purchaseButton").click(function(event){
            event.preventDefault();
            $('#pop-up2').load('html_elements/shop.html #gameShopItemPurchaseDialog');
            gameUi.setPopUpReference(1);                
            gameUi.showPopUp();
            gameUi.setUpPopUp();
            //jQT.goTo("#gameShopItemPurchaseDialog", 'slide');
            return false;
        });
    });

链接到项目: http://www.1luckypixel.com/PA_js_troubles/index.html 在弹出之前,有相当多的代码分布在多个文件中。我在一个紧迫的最后期限在目前,我必须提供一个建设的一天结束,所以我上传到我的网站上的项目。页面加载后,单击右上角的三角形以打开导航菜单,然后单击“shop”,然后单击任何一个项目(这将打开第一个弹出窗口),然后单击“buy”以打开第二个。弹出窗口上的“购买”按钮未设置,但“后退”按钮已设置。那是没有开火的锚。

3 回复 | 直到 16 年前

fantactuka 16 年前

var el = event.target; 到 var el = $(this);

同时移除 event.stopPropogation() preventDefault() -只需添加 return false 在函数末尾-这将遵循jQuery样式。

JoeM05 16 年前

为了记录在案。。。这不起作用,因为我没有在加载回调函数中添加按钮功能,而是将它添加到打开弹出窗口的按钮的单击行为中。

    var setUpDetail = function(id, item) {
    $('#pop-up').load('html_elements/shop.html #gameShopItem', function() {
        $('#gameShopItem h3').append(item.name+" Description");
        $('#gameShopItem p.itemDesc').append(item.description);
        $('#gameShopItem p.itemEffect').append(item.effect);            
        gameUi.readyPopUp();        
        $("#purchaseButton").click(function(event){
            event.preventDefault();
                            // added the popup window functionality to the call back function.
            $('#pop-up2').load('html_elements/shop.html #gameShopItemPurchaseDialog', function () {
                gameUi.readyPopUp();        
                return false;
            });
        });
    });     
}

user2910707 12 年前

只要给一些settimeout,它会给页面一些时间来完全加载…然后所有的事件都会工作,但它会产生性能问题。