カレンダーのために動的に生成された要素のjQueryクリックイベント？

Question

次questionに答え、

var counter = 0; 
$("button").click(function() { 
$("h2").append("<p class='test'>click me " + (++counter) + "</p>") 
}); 

$("h2").on("click", "p.test", function(){ 
alert($(this).text()); 
}); 

私はあなたの代わりに新しいWebページを開くと、個々の日をクリックすると、それはその日のイベントのカレンダーを交換することを動的に生成されたカレンダーを持っています。イベントはテーブルに表示され、行をクリックして location.assign()を使用する関数をトリガーできるようにしたいと考えています。だから、各行は、次のようなカレンダー負荷の

<tr id="message-7"> 

新しいページと作成し、

<tr id="message-132"> 

クリックすると、機能をトリガしません。他の質問の例では、私の状況のように要素に一意のIDを与えるのではなく、要素を一意にするために、要素のテキストにアクセスします。

私は間違った方法で問題に近づいていますか？私が参照できる"title=132"タグのようなものを追加できますか？

Answer 1

理想的には、IDからあまり意味を外さないようにしてください。代わりにshown hereというデータを使用します。

ので、代わりの

<tr id="message-7"> 

使用

<tr id="1234567" data-message="7"> 

はその後のコードで、あなたのようにデータを扱うことができます。その後、

var messageVal = $("#1234567").data("message") 

そして、あなたは一般的なクリックイベントを追加する必要がある場合適切なすべてのTRのダミーCSSクラス割り当てを使用することができます：

<tr id="1234567" data-message="7" class="messageRow"> 

あなたは

$(".messageRow").on("click", function(event){ 
    event.preventDefault() 
    var messageVal = $(this).data("message") 

を書くことができるように、これは一部だけTRのは、クリック可能なコンテンツが含まれます場合に有用である - ちょうど他の人にクラスを割り当てないでください。