Question

我想在Rails中调用Ajax调用。我已经看到使用:remote选项这样做的好方法。我有这个有效的例子：

<%= button_to('Get Transfers', {:action => 'get_transfers', :section_id => params[:section_id]}, :method => :get, :remote => true) %>

但是，我不希望用户通过按下按钮或单击链接来调用调用，而是在Javascript事件上调用它（将鼠标悬停在元素上）。

有没有办法使用:remote => true，但是当将鼠标悬停在元素上时会自动调用它？如果是，怎么样？

Answer 1

选项1

要使按钮响应点击并将鼠标悬停在其他div上，您可以尝试执行以下操作：

在你的视图中，你给按钮一个唯一的id，并将一些类添加到一个应作为触发器的元素：

<%= button_to('Get Transfers', {action: 'get_transfers', section_id: params[:section_id]}, method: :get, remote: true}, {id: 'remote_hover_button'}) %>
<div class="some_trigger">Hover me!</div>

在你的js中你想要绑定到那个触发器元素并触发按钮上的click事件：

$(document).ready(function(){
  $('.some_trigger').hover(function(){
    $('#remote_hover_button').trigger('click');
  });
});

选项2

通过创建您悬停的div并手动编写ajax来调用它：

<div class="some_trigger" data-url="<%= url_for(action: 'get_transfers', section_id: params[:section_id]) %>">Hover me!</div>

绑定到div并进行ajax调用：

$(document).ready(function(){
  $('.some_trigger').hover(function(){
    $.ajax($(this).data('url'));
  });
});

这实际上只会触发操作而不会对响应执行任何操作。您可以使用以下内容绑定到结果：

$(document).ready(function(){
  $('.some_trigger').hover(function(){
    $.ajax($(this).data('url'))
      .done(function() { alert("success"); })
      .fail(function() { alert("error"); })
      .always(function() { alert("complete"); });
  });
});

有关ajax函数的更多信息，请查看documentation。

使用：remote =＆gt;与悬停事件一样真实

1 个答案: