如何在Rails应用程序中单击link_to标记后用JS刷新浏览器

How to refresh the browser with JS after clicking a link_to tag in a Rails app

本文关键字：JS 浏览器 刷新 to Rails 应用程序 link 单击      更新时间：2023-09-26

我试图在用户单击链接到更新数据库的操作后刷新浏览器。

我想避免使用redirect_back来防止在重新加载后被发送回屏幕顶部，所以我添加了一个JS点击监听器到link_to标签，代码如下:

# in my view
<h5 class='my-link'><%= link_to 'vote', vote_path' %></h5> 
# at the bottom of my application layout
<script>
  $('.my-link').click(function (event) {
    window.location.reload(true);
  });
</script>

JS代码监听器工作正常，如果我点击h5元素的任何部分，页面将重新加载。但是，当我点击链接时，应用程序将转到相关的控制器#action，但页面不会重新加载。

我假设我错过了首先执行链接操作然后强制刷新的方法。因此，在点击时，应用程序记录投票，然后JS强制重新加载。你觉得我有什么办法可以做到吗?谢谢。

我通过在JS事件中添加计时器来解决这个问题，这样它就有时间让链接到达控制器并执行操作并在它之后重新加载。

<script>
  $(document).ready(function() {
    $('.puke-icon, .clean-link, .comment-send').click(function() {
        setTimeout(function(){
                   window.location.reload(true); },
             50);
          });
    });
</script>

这可能太粗糙了，所以希望你能提供更优雅的方法，谢谢!

在vote controller action中，在respond_to do format中使用location.reload()。

respond_to do |format|
    format.js {render inline: "location.reload();" }
end

视图:

<h5 class='my-link'><%= link_to 'vote', vote_path' %></h5>

控制器:

class VotesController < ApplicationController
  def vote
    ----------------------  
    // your code goes here
    ----------------------  
    respond_to do |format|
    format.js {render inline: "location.reload();" }
    end
  end
end

这将在数据库操作完成后重新加载页面。

$('.product').click(function () {
	location.reload();
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="container">
    <div class="row" id="footerRow">
         <div class="col-xs-12 product">
            <h2>Product</h2>
         <div>
         
    </div>
</div>

相关文章：