JQuery.live（）无法正常工作

Question

我知道live在版本1.7中被弃用，在1.9中被删除，并且不再推荐它。但仍然，因为我正在准备面试机测试，因此我试图区分live和on。 Document说

调用event.stopPropagation（）在事件处理程序处于停止的事件处理程序的安装文件 在下部无效;该事件已经传播到文件。

因此我试过这个。 标记：

<div> 
    <h1> 
     <a href="#"> 
      <span>Hello</span> 
     </a> 
    </h1> 
</div> 

脚本：

$(document).ready(function() { 
     $('span').live("click",function() { 
      alert('span'); 
     }); 
     $('a').click(function() { 
      alert('span a'); 
     }); 
     $('h1').click(function() { 
      alert('span a h1'); 
      event.stopPropagation(); 
     }); 
     $('div').click(function() { 
      alert('span a h1 div'); 
     }); 
    }); 

我使用jQuery 1.7版本，其中两个live和on存在。

发生了什么：

1. 跨度live是没有得到调用，而是直接调用的aclick。
2. 如果我删除除live之外的所有其他事件，则它将被调用。
3. 作为医生说，这是在做完全相反的，即它停止事件冒泡，如果我用live连接event.stopPropagation();

JSFiddle

Answer 1

事件处理程序一贯重视document。如果在live的回调中调用event.stopPropagation，则此事件已经冒泡到文档中，因此它不会直接附加事件处理程序。

事件何时到达您的event.stopPropagation()被调用时，h1元素，所以它永远不会到达那里的live事件处理程序附document。

随着on你可以创建所有类型的事件处理jQuery支持。如果你看一下jQuery的来源，你可以看到，在1.7 live功能只映射到：

live: function(types, data, fn) { 
    jQuery(this.context).on(types, this.selector, data, fn); 
    return this; 
} 

原因live被删除是使API更清晰，更符合逻辑的，当事件发生以及它们在哪里捕捉。

编辑

你的DOM，并在您的事件处理程序连接到的地方：

document $('span').live("click") **not called** (equal to: $(document).on('click', 'span')) 
    | 
    div  $('div').click() **not called** 
    | 
    h1  $('h1').click() + event.stopPropagation() **the propagation (bubbling) is stopped here not reaching the document** 
    | 
    a  $('a').click() 
    | 
    span  **event happens here and bubbles up**