jQuery append liはページに新しいコンテンツを生成しますが、新しいリンクは応答しません。

Question

jqueryのリストにliを追加しようとしています。ユーザーが保留中の招待を承諾すると、招待状のステータスはdbで確認済みに設定され、ページ上の「保留中の招待状」リストから削除され、下の別のULに表示されます。新しく作成された里のリンクが機能しないことを除いて、これはすべてうまくいきます。または、データベースからアイテムを削除するという観点からは機能しますが、画面からは消えません。私がページをリロードすると、それはなくなってしまいます。

teams_controller.erb：

 def myteams 
    action = params[:command] 

    if (action == "accept") 
     @invite = TeamUser.find(params[:id]) 
     @invite.confirmed = true 
     @invite.save 
     @newteam = @invite 
    end 

    if (action == "delete") 
     @invite = TeamUser.find(params[:id]) 
     @team = Team.find(@invite.team_id) 
     @invite.destroy 
     if (@team.owner == current_user.id) 
     @team.destroy 
     end 

    end 

    @teams = current_user.teams 

    respond_to do |format| 
     format.html 
     format.js 
     format.json { head :ok } 
    end 
    end 

myteams.js.erb：

$('#<%= dom_id(@invite) %>').fadeOut(700); 
<% if @newteam %> 
$('#acceptedList').append("<%= escape_javascript(render :partial => 'teaminlist', :locals => {:invite => @newteam})%>"); 
<% end %> 

_teaminlist.html.erb：

<li class='team' id='<%= dom_id(invite) %>' > 
    <h3> 
    <% if invite.team.owner == current_user.id%><i><% end %> 
    <%=link_to invite.team.name, 
      :controller => 'teams', :action => 'show', :id => invite.team.id %></i> 
    <%=link_to image_tag('delete.png'), 
      {:controller => 'teams', :action => 'myteams', :id => invite.id, :command => 'delete'}, 
      :class => 'deleteTeam', :remote => true %> 
</h3></li> 

ここに私のコードです10

myteams.html.erb：

<h3>My Teams</h3> 
<p id="notice"><%= notice %></p> 


<p style='clear:both'></p><hr width='660'><BR> 

<div class="post"> 
<h3 style="text-decoration:underline;">Pending Invitations:</h3> 
<ul style="list-style-type:none; line-height:20pt;" id='inviteList'> 
<% current_user.team_users.where("confirmed is null").order("created_at DESC").each do |invite|%> 
    <li class='invite' id="<%= dom_id(invite) %>"> 
    <h3><%=link_to invite.team.name, 
      :controller => "teams", :action => "show", :id => invite.team_id %> 
    <%=link_to image_tag("checked.png", :size => "16x16"), 
      {:controller => "teams", :action => "myteams", :id =>invite.id, :command => "accept"}, 
      :class => "deleteTeam", :remote => true %> 
    <%=link_to image_tag("delete.png"), 
      {:controller => "teams", :action => "myteams", :id =>invite.id, :command => "delete"}, 
      :class => "deleteTeam", :remote => true %> 
    </h3></li> 
<% end %> 
</ul> 

<h3 style="text-decoration:underline;">My teams:</h3> <ul style='list-style-type: none; line-height:20pt;' id = 'acceptedList'> 
<% current_user.team_users.where(:confirmed => true).order("created_at DESC").each do |invite| %> 
    <li class='team' id="<%= dom_id(invite) %>" > 
    <h3> 
    <% if invite.team.owner == current_user.id%><i><% end %> 
    <%=link_to invite.team.name, 
      :controller => "teams", :action => "show", :id => invite.team.id %></i> 
    <%=link_to image_tag("delete.png"), 
      {:controller => "teams", :action => "myteams", :id => invite.id, :command => "delete"}, 
      :class => "deleteTeam", :remote => true %> 
    </h3></li> 
<% end %> 

    </ul> 

    <h3><center><%= link_to "Create a Team", new_team_path %></center></h3> 
</div> 

もう一度、それは「削除」アイコンをクリックしたときに応答しないだけで、新しく作成された李です。既存の李さんの仕事は大丈夫です。助けて！

Answer 1

私はRubyを話せませんが、DOMを初めて読み込むときに要素が存在しないため、$.on()を使用する必要があります。

$('li.team').on('click', '.deleteTeam', function() { 
    // and the peasants rejoice!? 
}); 

あなたはjQueryのバージョン1.7.1 <上にある場合は、使用する必要があります。

$('.deleteTeam').live('click', function() { 
    // and the peasants rejoice!? 
}); 

クレジットkevivを小さな人々を認めるため。