jQuery的單擊或鼠標懸停功能沒有得到打

Question

我有以下HTML元素：

<a href='#' class='receipt' id='{some id. generated dynamically}'>Receipt</a> 

我有以下的jQuery，處理點擊：

$('.receipt').click(function() { 
       alert('hai'); 
       alert($(this).attr('id')); 
      }); 

出於某種原因，當我點擊....什麼都沒發生。我最初試圖使用mouseover，但我認爲我做錯了，所以我試着click。沒有骰子..我在這裏錯過了什麼？

更新 - 這是怎麼結束了工作，我使用.live超過.on傑夫乙建議，但我敢肯定.on會很好的工作。

$('.receipt').live('click', function() { 
    alert('hai'); 
    alert($(this).attr('id')); 
}); 

更新2 - .on將在未來取代.live，所以你應該使用.on。

Answer 1

你提到id是動態生成的。如果該元素是在處理程序創建後創建的，則不起作用。

對於動態元素，使用.on()：

$('body').on('click', '.receipt', function() { 
    alert('hai'); 
    alert($(this).attr('id')); 
}); 

在這種情況下，body是基本處理點擊，一旦事件向上行進的DOM元素，然後確保它起源於.receipt。您可以使用.receipt div的父/祖代的任何元素，而不是使用body，最好使用更接近的元素。

因爲body處理點擊，處理程序被附加到總是存在的東西。通過這種方式，您可以添加和刪除.receipt元素，而無需擔心處理程序消失。

Answer 2

變化$('receipt')到$('.receipt')

Answer 3

你缺少一個 ''在你的選擇器中。它用於選擇類。

應該是：$('.receipt')。

Answer 4

你需要使用$('.receipt')訪問DIV與它的CSS選擇器

Answer 5

您需要添加一個.字符使用類選擇

$('.receipt').click(function() { 
    alert('hai'); 
    alert($(this).attr('id')); 
}); 

見class selector docs here

Answer 6

你一定要請記住，當你使用類時，你必須編寫.className，如果你使用id，你必須使用#idName，因爲你必須將$（'receipt'）更改爲$（'。receipt'）