压倒一切的JQuery。点击（）函数

Question

我有一个位与jQuery的点击功能的prblem的，是我的代码布局的一部分：

<td id="01" class="day-main-diary"> 
    <div title="sdfsdf" class="diary-event ui-corner-all"> 
     <span id="delete"></span> 
     <div class="diary-event-title ui-corner-all"> 
      sdfsdf 
     </div> 
     <div class="diary-event-body ui-corner-all"> 
      <p class="hyphenate">sdfsdf</p> 
     </div> 
    </div> 
</td> 

标题，文字日记事件-title和文字在日记事件的身体都动态生成的类“天 - 主 - 日记”已绑定（在js文件的实际代码点击功能是：

$('.day-main-diary').click(function(){ 
    // Code is here 
} 

我是找一个click事件的方式对跨度的“删除”， 除其他事项外IH的ID识别AVE试图

$('.day-main-diary #delete').click(function(){ 

和

$('#delete').click(function(){ 

然而，每次完全忽略了这一事件，并总是调用日常的主要日志点击事件的时间。

任何人都可以帮助我吗？我将永远是伟大的 -Matt

Answer 1

首先，请记住页面上只能有一个#delete ID。如果有一个以上的，你就会有问题，而应该让一个类.delete。

如果#delete元素在页面加载（动态）时不存在，则可以使用.live()，无论何时添加元素，该元素都将负责为您处理事件。

$('#delete').live('click', function(){ 
      ... 
}); 

但是请注意，这将仍然火上.day-main-diary事件也是如此。

另一个选项是在.day-main-diary上调用.delegate()（只要在页面加载时存在）。这类似于.live()但更本地化。

$('.day-main-diary').delegate('#delete', 'click', function() { 
     ... 
}); 

这也会触发.day-main-diary上的click。不确定预期的行为是什么。

• http://api.jquery.com/live/
• http://api.jquery.com/delegate/

另一种选择是，以测试点击的e.target在.day-main-diary单击处理程序。如果是#delete做一两件事，如果没有，做一套。

$('.day-main-diary').click(function(e) { 
    if(e.target.id === 'delete') { 
     // run code for the delete button 
    } else { 
     // do something else 
    } 
}); 

否则，仍假设#delete是动态的，你可以在你创建绑定.click()。

$('<span id="delete">delete</span>').click(function(e) { 
     // your code 
     // uncomment the line below if you don't want the 
     // click event to fire on .day-main-diary as well 
     // e.stopPropagation() 
}) 
.appendTo('day-main-diary');