首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Jquery/Datatable:想要在加载时显示最后一个页面,但是page()和fnPageChange不起作用

Jquery/Datatable是一个流行的前端插件,用于在网页中展示和操作表格数据。在使用Jquery/Datatable时,如果想要在加载表格数据时显示最后一页,可以通过以下步骤实现:

  1. 首先,确保你已经正确引入了Jquery和Datatable的相关文件。
  2. 在初始化Datatable之前,设置"paging"选项为true,启用分页功能。
代码语言:txt
复制
$('#yourTable').DataTable({
  "paging": true,
  // 其他配置项...
});
  1. 在初始化Datatable之后,获取Datatable实例,并使用page()方法将当前页设置为最后一页。
代码语言:txt
复制
var table = $('#yourTable').DataTable();
table.page('last').draw(false);

这样,当表格数据加载完成后,会自动跳转到最后一页。

另外,如果你想在代码中手动触发跳转到最后一页,可以使用fnPageChange()方法。

代码语言:txt
复制
var table = $('#yourTable').DataTable();
table.fnPageChange('last');

这样,无论是在初始化加载时还是在其他操作后,都可以将当前页跳转到最后一页。

Jquery/Datatable的优势在于它提供了丰富的功能和灵活的配置选项,可以方便地实现表格数据的展示、排序、搜索、分页等操作。它适用于各种需要展示大量数据的场景,如数据报表、管理系统、数据分析等。

推荐的腾讯云相关产品:腾讯云对象存储(COS),它是一种高可用、高可靠、低成本的云端存储服务,适用于存储和处理各种类型的数据,包括图片、音视频、文档等。你可以通过以下链接了解更多关于腾讯云对象存储的信息:腾讯云对象存储(COS)

请注意,以上答案仅供参考,具体的实现方式可能会因具体情况而有所不同。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

DjangoWeb使用Datatable进行后端分页的实现

本人做的是一个表格监控页面,该页面中的table内容每5s刷新一次。...代码如下: 1.Html页面内容(本人用的是Admin.lte的前端框架), 引入Datatable css Js,并创建一个table: <link rel="stylesheet" href="...src="{% static '/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js' %}" </script 2.页面加载本人对表格内容进行了初始化...sPrevious": "上页", "sNext": "下页", "sLast": "末页" }, }, "bProcessing": true, //开启读取服务器数据显示正在加载中...补充知识:关于python的web框架djangoBootstrap-table的使用 这几天工作中发现要使用到Bootstrap的分页,django也有分页,但是当两者结合起来时发现,是一个强大的分页

5K20

datatables应用程序接口API

selector ); 上面三种方式均可返回一个api实例,注意区别 $( selector ).DataTable() $( selector ).dataTable() 前者直接返回API实例,...后者返回的是jQuery实例(如果是这个方式初始化Datatables,那么返回的对象不能使用api方法,不然会报方法未定义) 核心(Core) 名称 说明 ajax.reload()API 重新加载数据源获取数据...(完成)一个 jQuery 选择器操作 ajax.json()API 获得最终的json数据 ajax.params()API 获取最后一次Ajax请求提交的参数 ajaxAPI ajax方法的命名空间...pop()DT 从结果集中移除最后一个项目 push()DT 添加一个多个项目到结果集 reduce()DT 遍历结果集,通过回调函数返回从左到右的数据 reduceRight()DT 遍历结果集,通过回调函数返回从右到左的数据...API 获取该页面上所有的DataTables实例 $.fn.dataTable.util.escapeRegex()API 使用正则表达式转义特殊字符 $.fn.dataTable.util.throttle

4.4K30
  • 基于RequireJSJQuery的模块化编程——常见问题解析

    比如,我这里写了一个循环依赖的例子。 主页面: <!...会报一个异常: Uncaught TypeError: _table.dataTable is not a function 这是因为,dataTables并不是一个require风格的模块,因此直接这样引入...可以修改它的匿名函数,传入$对象,在最后一行: */ return $.fn.dataTable; //}));原来是这样 }($)));//这里增加执行这个匿名函数,并且传入$对象...requirejs使用jquery-ui的问题 由于requirejs加载js文件后会立即执行,如果你的jquery ui 插件需要刷新DOM页面,那么可能会导致页面的事件失效。...比如,你的模块在加载后,对页面的某个元素$('#test')绑定了click事件。但是使用了某个UI插件,这个插件会重新渲染DOM元素,test对应的click事件就失效了。

    2.9K100

    【8】数据浏览表格的快速输出

    但是好处在于,只要了解所有这些是如何实现工作的,那么,我们对于页面的掌控的程度可以达到一个新的高度。...在实际的应用中,配合JQuery、CSS样式表Ajax,可以发挥强大的威力,达到“无所不能”的境界。 表格还是列表? 输出数据库中数据列表,实际上就是以格式化的方法,把一个多行多列的数据展示出来。...显示效果如下: ? 对表格输出的封装 从上例可以看出,用表格输出数据列表的功能,是可以封装起来的。将上述处理放到一个独立的方法中,DataTable作为它的参数,表格生成就可以变得通用化了。...某些列,可能会用到,但是不需要显示。比如,ID列。 3、控制链接。对每行数据的具体的控制操作,常用的有删除编辑。 4、跳转链接。单击行,跳转到某个展示链接。...:删除页面 EditPage:删除页面 上述的各种参数,最后生成的表格包含了大多数数据列表需要的功能,但是对于某些情况可能就过于复杂了。

    2.5K50

    Django框架学习笔记(六)模板语言DTL

    如果需要传递列表,也应该把列表封装成字典的一个键值对。在模板语言中访问列表或者元组中的元素可以使用变量名.数字来访问列表中的元素,访问字典中的元素可以使用变量名.键名来访问。...我们在views中传递一个集合给模板文件,html页面中使用模板语言的for标签依次将数据显示出来。...1.案例 我们从文件夹中读取学生信息,打包成由字典组成的列表,通过context参数传递给html页面显示出来。我们首先定义一个方法load_from_file用于读取文本文件并打包成列表。...1.gif 2.使用DataTable展示数据 DataTables是基于jQuery一个插件,用于显示数据表格。...{{value|last}} # 序列的最后一个值 {{value|floatformat:3}} #浮点精度 {{value|join:"~"}} # 序列拼接 {{value|make_list

    4.3K41

    jquery datatable 参数

    一个例子 $(document).ready(function(){      $('#example').dataTable({   "bInfo": false     });  });  ...or false, default true 开关,是否显示表格的一些信息 bJQueryUI true or false, default false 是否使用jquery ui themeroller..., 比如['strip1', 'strip2', 'strip3'] 指定要被应用到各行的class风格,会自动循环 bDestroy true or false, default false 用于当要在一个元素上执行新的...,它的参数为要加载条目的数目,通常与bServerSide,sAjaxSource等配合使用 iDisplayLength 整数,默认为10 用于指定一屏显示的条数,需开启分页器 iDisplayStart...整数,默认为0 用于指定从哪一条数据开始显示到表格中去 iScrollLoadGap 整数,默认为100 用于指定当DataTable设置为滚动,最多可以一屏显示多少条数据 oSearch 默认{

    23110

    jQueryMobile快速入门

    .min.js"> 结构   一个jQuery Mobile页面你需要创建三块基本内容(头,正文,尾),要在html文档中的 head 标签内填写: 代码解释: data-role="page" 是显示在浏览器中的页面 data-role="header" 创建页面上方的工具栏(常用于标题搜索按钮) data-role="...通过唯一的id来分隔每张页面,在后面的代码编写中,推荐使用以上的构建方法来建立页面。 超链接 jQuery Mobile中的一个page”结构一般使用一个DIV来组织。...如果你想要一个仅是与内容一样宽的按钮,或者如果您想要并排显示两个或多个按钮,请添加 data-inline="true",如果组合按钮,可以使用 data-role="controlgroup" 属性...如需在页面加载展开内容,请使用 data-collapsed="false": <h1

    3.7K20

    深入webpack4配置笔记(必备可选配置 单页多页配置)

    )、自己用node写服务器(使用http协议,不足是本地代码修改后虽然实时打包但页面仍需手动刷新才能看见最新显示)。...懒加载:通过import异步加载模块就是属于一种懒加载但是到底什么时候加载这个模块,则取决于什么时候真正执行import语句。借助这种方法,可以更快加载页面。...,这样打包出来的页面首次加载js只会加载同步代码,异步模块代码会等到满足异步触发条件再另外加载对应的异步js文件,这样能明显提高页面首次加载的速度加载js代码的使用率。...分割同步模块代码只能是优化缓存提高页面二次加载的速度,对页面首次加载速度提升并无帮助。所以优化页面首次、多次加载速度需要分割打包异步同步模块,分别对应优化页面js代码使用率和缓存。...比较典型的案例就是页面加载后点击登录展示登录模态框,当页面首次加载不会加载登录模态框的模块代码,页面加载完毕后利用带宽释放空档提前加载登录模态框的模块代码文件,如此当用户点击登录按钮,可以直接调用相应的登录模态模块代码

    1.1K20

    ajax后退操作解决办法

    使用github项目 https://github.com/browserstate/history.js 问题场景 移动端网页列表(上拉加载执行ajax请求)中要在点击item详情页跳转后可返回,且返回页面中需要看到或定位到点击的来源位置...测试 要实现准确定位,刚开始的基本原理也就是俩页面之间跳转传递分页数滚动条位置的数量,想过sessionstorage对象来存储或是用url中hash值、query参数来传递相关状态,列表页面中进行判断请求数据且修改...dom) History.pushState({'dom':dom,'p':this.contentData.page+1});//记录最后一次分页加载的dom数据以及下一页的起始数 /...这里缓存了所有ajax分页的DOM数据请求的最后的页码,当返回到列表页面的时候获取缓存DOM并加载,起始的分页数也会还原。...实际使用中会发现个别时候item详情页面中执行history.go(-1)或者点击A标签链接返回到列表页面的时候缓存的分页DOM数据可以正常的显示但是滚动条定位就没达到想要的效果,所以要完美应该在获取缓存数据的时候添加一个

    77320

    【权限的思考】(一)使用反射实现动态权限

    也可以说是插件化的权限管理,通用的插件化框架是实现一个接口或者协定, 我们的做法是先展示指定的数据,再去动态的加载需要用到的dll功能。   ...把这些内容 动态的添加到页面上,当点击页面上的元素利用反射,匹配目录下的dlldll内的页面,进行读取,并显示进行交互, 从面实现插件化动态加载内容。如下图所示:      例: ?...在顶部添加一个Panel用来动态添加按钮,这些动态添加上的按钮就是我们利 用反射动态加载的dll库。在下边也添加一个Panel用于动态显示权限信息,对应是dll库里面有权限的页面。...》模拟权限数据   写一个单例类,创建一些权限数据,用于模拟从服务器上返回的数据。返回的数据有模块id,模块名称,命名空间父id。 我们可以把这些数结构想像成一棵树结构。...ParentId] = parentId; PermissionTable.Rows.Add(newRow); } } 》根据权限动态加载页面利用反射去打开相应的页面

    86790

    jQuery Bootstrap 在 WordPress 中添加进度条

    今天突然一个进度条,可以直观看下显示一下翻译了几篇。 思路 手动更新肯定是不行的,程序员就是要懒。...方法还是有挺多的,很多JavaScript的库都可以实现这个功能,但是因为WordPress里已经自动加载jQuery了,所以就不想再引入其他库了,而且这个需求也很简单,用jQuery就足够了。...在页面上加上如下的 shortcode,就可以把所有标签为 genesis-explained 的文章按顺序查出来并显示(默认显示10篇, 多于10的话可以自己设置数量,或者用posts_per_page...display-posts-listing li").size() var progress= parseInt((completed / 15) *100) + "%" 第三步 数据有了,那么还需要在页面上加一个...,我只想在这一个页面显示这个进度,其他页面上都不需要,所以,新建一个针对这个页面的模板 page-genesis-explained.php,放在子主题的目录下。

    1.3K40

    【手把手】JavaWeb 入门级项目实战 -- 文章发布系统 (第十二节)1.评论功能实现2.评论加载

    在JSP页面是这样接收的: <%@ page language="java" import="java.util.*" pageEncoding...O(∩_∩)O~~ 2.评论加载 评论保存已经没问题了,接下来就是加载。 回到detail.jsp页面,第一步,是不是要导包啊?...,要是不起作用的话呢,就重启一下tomcat。...最后,当提示保存成功的时候,顺便把页面刷新一下,这样方便我们直接看到效果: 本文结束... 最近事情太多,一方面项目工期加紧,空余时间越来越少。...这个系列,到这一节,一共写了12章,虽然不够完整,但是基本的前后台已经有了。我,对于新人而言,还是有一定的借鉴意义的。

    2.1K152

    Jquery DataTable 的学习之基础配置(二)

    2017-01-12 03:19:31 本文将介绍jquery DataTable的一些基础配置,如分页、排序、过滤等,代码如下 $(document).ready(function() { $('...DataTable将会在页面上将表格进行分页处理,此分页的方式与后台无关,只需要在初始化之前将数据填充到表格当中,然后进行表格初始化操作,之后插件会自动对表格进行分页处理。...1.2改变每页显示数据数量 此功能的前提是需要开启分页功能,它可以控制每页显示的数据量,插件会根据每页显示的数据量自动进行分页处理,同样不需要后台控制,只与前端页面相关。...1.4排序功能 通过设置排序功能后用户可以在点击表头进行排序处理,例如某列为价格信息,那么点击价格列后,插件会自动根据价格进行排序,可进行升序降序排序。...1.5页脚信息 填入页脚信息会在表格最下方显示一个文字信息,来对表格进行描述说明等。 1.6自动宽度 插件会根据表格内容对宽度进行自动处理

    1.2K10

    Datatables表格插件,你用过吗?

    Datatables是一款jquery表格插件。它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能。...分页,即时搜索排序 几乎支持任何数据源:DOM, javascript, Ajax 服务器处理 支持不同主题 DataTables, jQuery UI, Bootstrap, Foundation...这时候就有一个问题了,后台分页如何知道你按多少数据分页的,你的排序方式是按哪个字段进行什么排序的。...在ajax请求中利用data属性动态实时获取用户输入的数据,并把其赋值给dataTable,然后doSearch方法中重新拉起一次dataTable请求,这时请求参数就添加了需要的字段值; <form...可以在模型中定义一个字段(我这里叫action)只要和你的colums:[{data:'action'}]对应就可以。使用laravel的模型属性方法去实现。 <?

    6K30

    Django添加ckeditor富文本编辑器

    第一步操作,重新加载页面,中文字体显示但是名称却显示乱码?在虚拟机的Ubuntu上用火狐试了一把,同样的问题,可见浏览器没有关系,问题出在服务器端。...root权限下,在vim中修改文件的编码:set fileencoding=utf-8后,重新加载页面显示正常。 四.如何高亮代码?...这是因为前端还需要加载一些js文件css文件。 1.Refer to codesnippet插件 Target Page,http://docs.ckeditor.com/#!...config.tabSpaces = 0; 设置当用户键入TAB键,鼠标走过的空格数。当值为0,焦点将移出编辑框。 八.使用序列标号的时候,页面溢出?...九.前端页面显示的字体/大小后端设置的不一样? 前端页面CSS造成的,如何解决? 十.使用七牛云存储,缩略图无法生成?

    2.1K30

    Asp.net之真假分页大揭秘、使用AspNetPager实现真分页

    起初做的时候并没有太多,只按着最简单的方式将所有的图片从数据库中查出来并显示在界面中,做完界面之后,自己在数据库中添加了一些数据做测试,发现每次打开网页都很慢。...分页 分页是将所有的内容分成不同的页面,它是常用的导航技术,在web开发中都会涉及到。分页分为真分页假分页两种。...真分页 控件上每一页需要显示多少数据,就从数据库取出并绑定多少数据,每次换页都需要访问数据库。...Page.IsPostBack) { //第一次进入该页面 //加载所有的书画作品...(比如数据量较多时,用真分页;减少与后台的交互,可以使用假分页)。 假分页,如果数据量较多,在首次页面加载的时候会比较慢,严重影响用户体验,Web开发搜索引擎优化。

    1.2K00
    领券