Question

我实现了一个功能，用户可以直接从点击表输出中将对象属性更新为true / false。一切都是第一次正常工作，但在完成ajax调用之后，我再也无法做到了。也许DOM无法加载？

我有我的桌子：

<div id="dashboard_pages_table" class="small-12 columns">
    <%= render partial: 'layouts/admin/dashboard_pages_table', locals: {parents: @parents} %>
</div>

正在听一个td元素上的点击事件的coffeescript：

jQuery ->
   $('#sortable .onoff').on "click", (event) ->
     page_id = event.target.parentElement.parentElement.id.match(/\d+$/)[0]
     $.post 'update_row_onoff',
      page_id: page_id

coffeescript正在我的控制器中调用update_row_onoff方法：

def update_row_onoff
   @target_page = Page.find(params[:page_id])
   if @target_page.active
     @target_page.update_attribute(:active, false)
   else
     @target_page.update_attribute(:active, true)
   end
   respond_to do |format|
     format.js
   end
end

然后update_row_onoff js.erb文件正在重新加载dashboard_table的内容：

$('#dashboard_pages_table').html("<%= escape_javascript(render partial: 'layouts/admin/dashboard_pages_table', locals: {parents: @parents}) %>");

为什么在第一次成功的后期行动后它无效？

Answer 1

改为使用

$("body").on "click", "#sortable .onoff", (event) ->

事件处理程序仅绑定到当前选定的元素;它们必须存在于您的代码调用.on（）时的页面上。要确保元素存在且可以选择，请在文档就绪处理程序内对页面上HTML标记中的元素执行事件绑定。如果将新HTML注入页面，请在将新HTML放入页面后选择元素并附加事件处理程序。或者，使用委托事件来附加事件处理程序，如下所述。

有关详细信息，请转到api文档http://api.jquery.com/on/

Jquery在第一次动作调用后没有触发事件

1 个答案: