jQuery - ボタンのクリックがうまくいきません

Question

ここで本当に簡単な質問は、私にそれを求めて殺します。私はただそれを修正することはできません。

ajax呼び出しでは、アイテムのリストを表示したいと思います。各項目にはボタンがあります。最終的に私はこのonclickを持って次に

$.each(data, function (index, activity) { 
    var newActivity = activityDiv.clone(); 
    var startTime = new Date(activity.startDateTime); 
    var endTime = new Date(activity.endDateTime); 

    newActivity.find(".activity-name").text(activity.name); 
    newActivity.find(".activity_start").text(startTime); 
    newActivity.find(".activity_end").text(endTime); 
    newActivity.find(".delete").val(activity.id); 
    calendar.append(newActivity); 
}); 

：アヤックスと私はそうのようなリストを作成するjQueryの中に今

<div id="calendar"> 
    <div id="activity_wrapper"> 
    <h4 class="activity-name"></h4> 
    <p class="activity_start"></p> 
    <p class="activity_end"></p> 
    <a class="start" id="start">Start Activity</a> 
    <a class="finish">Complete Activity</a> 
    <button id="delete-activity-button" class="delete" value="">Delete</button> 
    <button id="modify-activity-button" class="modify" value="">Edit</button> 
    </div> 
</div> 

：

は、だから、私はHTMLでこのdiv要素を入れ

$('.delete').click(function(e) { 
    var selected = $(this).attr('class') || $(this).attr('id'); 
    var id = selected.val(); 
    alert(id); 
}); 

クリックは登録されません。私は間違って何をしていますか？私はそれが私が活動クラスをクローンする方法によると信じています。

ありがとうございました。

Answer 1

IDを含む要素にはclone（）を使用しないでください。なぜなら、IDは一意でなければならないからです。また、クリックハンドラは、複数の同一のIDのために不一致な動作をするIDで作業しようとしています。

Clone（）は、あなたが最初のdivに添付したイベントを（本当に渡さない限り）クローンしないので、クリックしたハンドラは接続時に応じて起動しませんそれ。

$('#calendar').on('click', '.delete', function(e) { ... }); 

ので、あなたはすべての活動にイベントをクローニングを心配する必要はありません：親にあなたのクリックハンドラをアタッチする方が良いだろう。

Answer 2

あなたのコードに何らかの欠陥が見つかりませんでしたが、クリックする代わりに "オン"を試すことができます。それが動作しない場合私に知らせてください。

主に、動的DOMオブジェクトには「オン」イベントが使用されます。

http://dotnet-helpers.com/jquery/