单击事件后事件冒泡jQuery .delegate()或.live()

时间:2010-08-05 00:05:23

标签: javascript dom jquery event-delegation

我已经尝试了很多不同的可能性来实现我认为应该是简单的代码执行。我通过.load()从服务器加载DOM对象。其中一个已加载的项目是一个输入文本框,其中包含日期。我想在点击输入框时加载jdpicker(一个插件datepicker)。由于.live().delegate()的行为,即使我分别使用.die().undelegate(),我也无法使弹出式日期选择器正常运行。它弹出,允许我单击窗口中的一个对象,然后立即关闭(我无法浏览月份,没有窗口关闭的年份),或者窗口弹出,每次后续点击重新执行生成多个实例的代码日期选择器。

我尝试了.live().delegate().one()的不同组合,但没有运气。我已在主窗口中测试了datepicker,并知道它在那里工作正常。我可以发布代码,但我不确定我所做的十次不同尝试中哪一次是最好的例子。我可以展示我最近的尝试。

有没有人有合适的例子呢?谢谢!


更新

我编写的代码如下:

$("#edit-entry").load("/edit/", { id:id }, function(){
                $('.jdpicker').one('click', function(){
                    $(this).jdPicker();
                });
});

这是成为完整答案的关键。 datepicker不再调用多个实例,这很好,但我仍然无法浏览它的控件(月份,年份选择)。如果我点击下个月,它将加载并关闭。下次我点击它,它会在下个月重新打开。所以,它确实有效,但肯定不可取。有什么建议吗?

1 个答案:

答案 0 :(得分:0)

你不能用“live”或“delegate”来做到这一点。事实是你需要在“.load()”成功后显式应用你的插件初始化。

编辑 - 您所做的更改可能无法正常进行。这是你的英文代码:

  

“从URL中获取内容'/ edit /'并将其存入id为'edit-entry'的元素。当收到该内容后,将一次性事件处理程序绑定到”click“功能所有带有'jdpicker'类的元素。在该事件处理程序中,为元素设置'jdPicker'功能。“

相反,你应该做的只是直接调用jdPicker设置而不是设置它,以便用户必须先点击元素。

$("#edit-entry").load("/edit/", { id:id }, function(){
    $('.jdpicker').each(function(){
        $(this).jdPicker();
    });
});