0

我正在尝试以“rails 方式”来做到这一点，因为我正在学习 rails 并想了解它。

这是我的“问题”。

我有一个简单的订阅表单，在home.html.erb中看起来像这样

<%= form_tag(  subscribe_newsletter_path , id:'subscribe-form', remote: true) do %>
    <%= email_field(:subscription, :email, placeholder: 'ex: Giroud@Arsenal.com') %>
    <%= submit_tag("Subscribe Now!", class: 'btn btn-success') %>
<% end %>

我在home.js中的 javascript是：

$('#subscribe-form')
.on('ajax:beforeSend', function(){
    console.log('before send');
})
.on('ajax:success', function(){
    console.log('success');
})
.on('ajax:complete', function(){
    console.log('complete');
})
.on('ajax:error', function(){
    console.log('fail');
})

我的application.js

//= require jquery
//= require jquery_ujs
//= require_tree .

我的home_controller.rb文件看起来像这样（这对我来说很棘手）

response = //Response message from mailchimp API. looks like that {"error"=>"bablabla@gmail.com is already subscribed to list Testing Rails. <a href=\"http://test.us6.list-manage1.com/subscribe/send-email?u=test&id=test&e=test==\">Click here to update your profile.</a>", "code"=>214}

render json: response, status: '200'

ajax 请求确实被触发，我的控制器收到电子邮件并将其发送到 mailchimp API，然后将其发送回浏览器（状态 200，我可以在 Chrome 开发工具中看到 json 响应）但没有任何绑定事件触发。 ...我知道它正在工作，因为当我将事件绑定到 $(document) 而不是 $('#subscribe-form') 它工作正常...

为什么？

4

1 回答 1

2

从 jQuery 1.7 开始，.on() 方法是将事件处理程序附加到文档的首选方法。对于早期版本，.bind() 方法用于将事件处理程序直接附加到元素。处理程序附加到 jQuery 对象中当前选定的元素，因此这些元素必须存在于调用 .bind() 的位置。有关更灵活的事件绑定，请参阅 .on() 或 .delegate() 中有关事件委托的讨论。

更多：http ://api.jquery.com/bind/

它在 rails 3.2 应用程序中为我工作的方式，只是示例，而不是您的案例的确切解决方案：

$(document).ajaxSend(function() {
  $( "#loading" ).show();
});

$(document).ajaxComplete(function() {
  $( "#loading" ).hide();
});

因此，您的问题可能在于使用较新的 Jquery 版本时使用 .bind 。

编辑

该ajaxComplete()方法指定 AJAX 请求完成时要运行的函数。

注意：从jQuery版本1.8开始，此方法只能附加到document。

与 不同ajaxSuccess()的是，使用该方法指定的函数ajaxComplete()将在请求完成时运行，即使它不成功。

于 2013-07-26T10:19:29.387 回答