첫 번째 클릭시 jQuery가 작동하지 않습니다.

Question

레일스를 사용 중이며 ajax에 북마크 아이콘을 만들려고합니다. 코드가 작동합니다. 문제는 요청이 전송되었지만 이미지가 변경되지 않는 첫 번째 클릭에 대한 것이며, 다음 클릭에 대해서는 문제가 OK입니다 (요청 전송 및 이미지 변경).

내보기 :

<%= link_to favorite_company_job_path(@job, matching_id: candidate.id), method: :post, remote: true do %> 
    <span class="favorite"> 
    <% if candidate.favorite %> 
     <img src="<%= asset_url "favorite-activated.png" %>" alt="favorito" class="img-40" id="favorite_activated_<%= candidate.id %>"> 
    <% else %> 
     <img src="<%= asset_url "favorite.png"%>" alt="favorito" class="img-40" id="favorite_<%= candidate.id %>"> 
    <% end %> 
    </span> 
<% end %> 

내 파일 favorite.js.erb

$('#favorite_<%= @matching.id %>').on({ 
    'click': function(){ 
    $('#favorite_<%= @matching.id %>').attr('src','<%= asset_url "favorite-activated.png" %>'); 
    $('#favorite_<%= @matching.id %>').attr('id','favorite_activated_<%= @matching.id %>'); 
    } 
}); 

$('#favorite_activated_<%= @matching.id %>').on({ 
    'click': function(){ 
    $('#favorite_activated_<%= @matching.id %>').attr('src','<%= asset_url "favorite.png" %>'); 
    $('#favorite_activated_<%= @matching.id %>').attr('id','favorite_<%= @matching.id %>'); 
    } 
}); 

내 컨트롤러 :

def favorite 
    @matching = @job.matchings.find(params[:matching_id]) 
    if @matching.favorite 
     @matching.favorite = false 
    else 
     @matching.favorite = true 
    end 
    @matching.save 
    respond_to do |format| 
     format.html { redirect_to company_job_path(@job) } 
     format.js # <-- will render `app/views/company/jobs/favorite.js.erb` 
    end 
    end 

어떤 생각?

Answer 1

반면, 실제로 필요한 것은 코드를 실행하는 것입니다. 당신은 레일 자체에서 설치를 이미를했습니다 때문에, 청취자가 필요하지 않습니다 :

<%= link_to favorite_company_job_path(@job, matching_id: candidate.id), method: :post, remote: true do %> 

생각 당신이 콜백 될 것으로 기대 당신의 favorite.js.erb 및 설치 코드의 단지 일부 변경 :

$('#favorite_<%= @matching.id %>').attr('src','<%= asset_url "favorite-activated.png" %>'); 
$('#favorite_<%= @matching.id %>').attr('id','favorite_activated_<%= @matching.id %>'); 

$('#favorite_activated_<%= @matching.id %>').attr('src','<%= asset_url "favorite.png" %>'); 
$('#favorite_activated_<%= @matching.id %>').attr('id','favorite_<%= @matching.id %>'); 

을

이 도움이 될 것입니다. 희망이 도움이

Answer 2

대신 $('#id').on('click', function(){});

의 사용은 $(document).on('click', '#id', function(){});

희망이 .. 당신을 도와줍니다

내가 지금 당신의 코드에서 클릭에 대한 당신의 반응 방금 설치 청취자를 참조 무엇