Javascript 要使用的jQuery.live、click、bind等

这听起来可能很“愚蠢”，但我有一个简单的日历加载到页面上，如下所示：

jQuery('#calendar .show_hide').load('plugins/calendar.html', function(){ // do something // });

这不是问题

日历有两个链接，可以滚动浏览月份-典型的下一个上一个链接。在我的加载函数中，我有这个

jQuery('#calendar .show_hide').load('plugins/calendar.html', function(){
   jQuery('a.month_change').on('click',function(){  
    jQuery.ajax({
      type: "post",
      data: jQuery(this).attr('href').replace('#',''),
      url:  'plugins/calendar.html',
      success:function(msg){
        jQuery('#calendar .show_hide').html(msg);
                  }
    });
});

});             

其中a.month_change是附加到上一个/下一个链接的类。Ajax post发送数据并返回html。到目前为止还不错

第一次单击a.month\u change时，它会工作，但每次之后都不会加载页面。如果我尝试

.live（'click；，function…

第一次什么都不会发生，其他也不会

我总是对这些事情感到困惑，这是动态加载页面，然后让ajax调用/链接等正常工作的正确方法。请注意，动态加载和ajax接收页面是相同的页面-plugins/calendar.html和JQ版本是jquery-1.9.0

live（）

被折旧，您应该使用（）功能

$(document).on('click','selector',function(){

});

使用

.on（）

，因为它也适用于动态添加的

DOM

.live（）

已从新版本中弃用

试一试

$（函数（）
{
jQuery（'a.month\u change'）。在（'click'，function（）上
{
jQuery.ajax(
{
类型：“post”，
数据：jQuery（this.attr（'href'）.replace（'#'，''），
url:'plugins/calendar.html'，
成功：功能（msg）
{
jQuery（'#calendar.show_hide'）.html（msg）；
}
});
});
jQuery（'#calendar.show_hide'）.load（'plugins/calendar.html'，function（）
{
});    
});

最好是在方法上使用Jquery

。新版本中不推荐使用live（）

对于eg

$('#yourElement').on('click',function(){});

Live从1.7开始就被弃用，并在1.9中被删除。您必须像这样使用它

$(document).on('click','selector',function(){

});

如果有更接近的静态元素，则应使用最接近的静态元素，而不是文档。
试试看

$(parentcontainer).on('click',elementtoclick,function(...){....});

通常以这种方式绑定解决了我在新HTML内容方面的问题
这里的答案都没有有效地向您展示如何使用它，或者文档，所以请看这里

jQuery(document).on('click', 'a.month_change', function(){ 
    jQuery.ajax({ 
        type: "post", 
        data: jQuery(this).attr('href').replace('#',''), 
        url: 'plugins/calendar.html',             
        success:function(msg){ 
            jQuery('#calendar .show_hide').html(msg); 
        } 
    }); 
});

其中，我们目标的第一个元素是页面加载期间存在的静态元素，然后是我们希望捕获的事件，然后是应该将事件绑定到它的元素。这是较新版本的jQuery中的事件委派。您不需要使用
.live（）
或
.bind（）

我更喜欢并建议您使用（）上的
。您可以查看此内容，了解有关
上的
直接和委托方法的更多信息

$(document).on('click','yourselector',function{....});

这会将click事件委托给始终是静态的文档，并找到用于放置事件的选择器。但是，由于文档性能不佳，因此始终首选使用最接近的静态元素。
。click
和
。bind
与页面加载期间dom中当前存在的dom元素绑定。

.live
用于为元素附加事件，该元素以后可能由Ajax或Javascript在DOM中填充。但是.live存在与性能相关的重大问题

在DOM层次结构中引入性能更好的代理

随着最新的Jquery 1.7或更高版本的推出，
。on
用于在DOM中填充元素时将事件绑定到元素（运行时）。它提高了性能
那么.live你可以在这个网站上获得更多信息
这将为insite提供jQuery事件绑定
，因为其他答案都没有解决您提出的问题：

第一次单击a.month\u更改时，它会工作，但每次
之后，页面将不会加载

那么让我试着解释一下

您的代码实际上正在进行两个AJAX调用，一个来自
.load（）
，另一个来自
.AJAX（）

导致单击事件只触发一次的问题是因为您正在将
.ajax（）
调用的成功处理程序中的日历HTML替换为
jQuery（“#calendar.show_hide”）.HTML（msg）
，从而替换先前绑定单击处理程序的
a.month\u change
元素

修复方法是将click事件绑定移动到页面中未被任何AJAX调用替换的元素上

例如，在
#日历
元素上：

jQuery('#calendar').on('click', 'a.month_change', function(){ ... });

因此，您可以替换
#calendar
中的所有内容，单击事件仍将被捕获，然后由静态祖先元素上的单击处理程序进行过滤

正如其他答案所提到的那样，v1.9中删除了
.live（）
，您使用的是正确的
.on（）
方法，但位置不对。
如果您查看代码，它就是。on（‘点击’，……但这仍然不起作用。如果我的措辞是正确的，我认为这意味着该事件不具有约束力reload@WatkinParrot查看更新后的答案，查看是否符合上面的评论。在（'单击'…alreadyAnton-完美感谢将尽快接受
jQuery('#calendar').on('click', 'a.month_change', function(){ ... });