javascript - 在 ROR 中加载 AJAX 后,如何使页面跳转到顶部?

标签 javascript jquery ruby-on-rails ajax ruby-on-rails-4

我理解下面的js应该让浏览器跳转到页面顶部,

$('html').scrollTop(0);

但是我应该把这段代码放在哪里,以便在 ajax 加载后它会被激活?

我有一个包含异步加载 js 的 show.js.erb 文件,但简单地把那个 js 放在那里是行不通的,我想是因为它会同时发生加载。

$("#tag_posts").html("<%= escape_javascript(render @atag) %>");

那么,我该怎么做呢?

谢谢!

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta charset="utf-8">
        <meta name="generator" content="Bootply" />
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <!--[if lt IE 9]>
            <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    <!-- Google Fonts -->
    <link href='http://fonts.googleapis.com/css?family=Bree+Serif' rel='stylesheet' type='text/css'>
    </head>
    <body>
<div class="wrapper">
    <div class="box">
      <div class="column col-sm-12 col-xs-12" id="main">

            <!-- main right col -->
            <div class="column col-sm-9 col-xs-11" id="main">

                <div class="padding">
                    <div class="full col-sm-9">

                        <!-- content -->                      
                        <div class="row">

                         <!-- main col left --> 
                         <div class="col-sm-12">

                              <!-- Render Tag Posts Asynchronously to Populate Stream -->
                              <div id="tag_posts"></div>

                              <!-- Render Posts Partial to Populate Stream -->
                              <%= render "posts/index" %>

最佳答案

当然你需要它在每次 Ajax 调用时发生,但如果你这样做,你可以使用 ajaxComplete .每次 Ajax 调用完成时都会触发。

$( document ).ajaxComplete(function() {
    $('html').scrollTop(0);
});

如果不想每次调用都触发,可以在函数中添加条件:

$( document ).ajaxComplete(function( event, xhr, settings ) {
    if ( settings.url === "<%= escape_javascript(render @atag) %>" ) {
        $('html').scrollTop(0);
    }
});

如果您需要更多有用的示例,请查看链接。

关于javascript - 在 ROR 中加载 AJAX 后,如何使页面跳转到顶部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28261307/

相关文章:

java - 如何在端点类上实现自定义 @JsonDeserialize 方法?

ruby-on-rails - Rails ActiveStorage 如何通过 REST API 上传文件

ruby-on-rails - Ruby on rails 全局变量?

javascript - html内容的json解析错误

javascript - 如何将文本区域中的数据写入txt文件

javascript - 图像描述网站

jquery - Cycle2 轮播不应更改上一个/下一个操作的事件幻灯片

javascript - 正则表达式替换的内容超出了我的预期

ruby-on-rails - Rails 4 : Sort by associated created_at if present, 否则由父级

javascript - 仅通过滚动更改涉及每个菜单项的背景图像