Question

我在js.erb文件中使用escape_javascript以使用AJAX加载部分：

$("#datas-user").html("<%= escape_javascript(render :partial => '/pro/users/show_partial', :locals => { :id => @user.id }) %>");

我的问题是我的部分中使用的javascript似乎已被破坏？

在我看来，我有一个按钮id =“relation-contact-button”，使用jQuery Hide函数显示在显示中加载的div：none

我的部分：

<div class="row">
<div class="col-xs-7">
    <div class="user_name"><%= @user.firstname %> <%= @user.lastname.chr %>.</div>
</div>
<div class="col-xs-5">
    <div id="relation-contact-button" class="btn btn-blue">Contact</div>
</div>
</div>

<div id="relation-contact" class="rows">
<div class="col-xs-12 col-lg-12">
<%= form_for :message, url: pro_messages_path do |f| %>
<%= f.label :message, :class => "search-title" %>
<div class="form-group">
<%= f.text_area :message, :rows => 2, :class => "form-control", :placeholder => "Expliquez ce que vous pouvez apporter à cette personne" %>
</div>
<%= f.hidden_field :user_id, :value => @user.id %> 
<%= f.submit "Envoyer", :class => "btn btn-blue" %>
<% end %>
</div>
</div>

我的css：

#relation-contact {
display: none;

}

我的js：

$("#relation-contact-button").click(function(){
    $('#relation-contact').show();
});

当我使用相同的代码而没有部分工作时，没有任何事情发生。

有没有办法渲染我的部分并保持我的js工作？

非常感谢。

˚F

Answer 1

这就是：

加载网站后，您的js会启动并将click事件处理程序绑定到＃relation-contact-button。然后你做任何事情并调用你的ajax处理程序

$("#datas-user").html("<%= escape_javascript(render :partial => '/pro/users/show_partial', :locals => { :id => @user.id }) %>");

＃datas-user中的所有内容都被删除并替换为您的部分，并且没有事件侦听器绑定到任何内容，因为处理程序绑定的元素已经消失。您必须在ajax成功处理程序中再次将处理程序绑定到新呈现的＃relation-contact-button，或使用：

$("#datas-user").on("click", "#relation-contact-button", function(){
 $('#relation-contact').show();
});

而不是

$("#relation-contact-button").click(function(){
 $('#relation-contact').show();

See the .on() doc了解更多信息。

Rails escape_javascript打破部分使用的javascript

1 个答案: