bootstrap table实现点击翻页功能 可记录上下页选中的行

发布时间 - 2026-01-11 03:27:19    点击率:

bootstrap-table中实现,翻页之后再返回,依然选中的情况,具体内容如下

//var productids = $("body",window.parent.frames[0].document).find('.ptids');//textarea存放数据
var productids = $('textarea');
var merge_order_object= {};//页码+id组成的对象
var jsonObj = {};
var current_page = "";//当前页码

//表格渲染完成操作
table.on('post-body.bs.table', function (e, settings, json, xhr) {

  var merge_order_arr = [];
  var objString = productids.val();
  if(objString !== ""){
    jsonObj = JSON.parse(objString);//转换为json对象
    $.map(jsonObj, function (arr) {
      // merge_order_arr.push.apply(merge_order_arr,arr);//合并数组
      merge_order_arr = merge_order_arr.concat(arr);//合并数组
    });
    $.each(settings,function (i,v) {
      $.each(merge_order_arr,function (index,value) {
        if(v.id === parseInt(value)){
          $(e.target).find('tbody tr').eq(i).find('input').click();
        }
      });
    });
    // productids.val( objString );
  }
  // debugger;
});
$('input[name="btSelectAll"], table tbody, input[name="btSelectItem"]').change(function () {//复选框
  current_page = table.bootstrapTable('getOptions').pageNumber;
  merge_order_object[current_page] = Table.api.selectedids(table);
  productids.val( JSON.stringify(merge_order_object) );//转换成字符串

});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


# bootstrap  # table  # 点击翻页  # Bootstrap CSS组件之分页(pagination)和翻页(pager)  # Bootstrap实现翻页效果  # 转换成  # 转换为  # 翻页  # 具体内容  # 大家多多  # 复选框  # current_page  # jsonObj  # textarea  # ptids  # id  # merge_order_object  # post  # json  # xhr  # merge_order_arr  # bs  # function  # settings  # brush 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 制作无缝贴图网站有哪些,3dmax无缝贴图怎么调?  企业网站制作这些问题要关注  Laravel Admin后台管理框架推荐_Laravel快速开发后台工具  如何在阿里云服务器自主搭建网站?  中山网站制作网页,中山新生登记系统登记流程?  如何自定义safari浏览器工具栏?个性化设置safari浏览器界面教程【技巧】  如何利用DOS批处理实现定时关机操作详解  Laravel如何实现密码重置功能_Laravel密码找回与重置流程  C++时间戳转换成日期时间的步骤和示例代码  html5如何设置样式_HTML5样式设置方法与CSS应用技巧【教程】  如何在IIS中新建站点并配置端口与IP地址?  儿童网站界面设计图片,中国少年儿童教育网站-怎么去注册?  jQuery中的100个技巧汇总  Laravel Artisan命令怎么自定义_创建自己的Laravel命令行工具完全指南  企业在线网站设计制作流程,想建设一个属于自己的企业网站,该如何去做?  Laravel怎么上传文件_Laravel图片上传及存储配置  PythonWeb开发入门教程_Flask快速构建Web应用  Windows10电脑怎么查看硬盘通电时间_Win10使用工具检测磁盘健康  如何快速搭建自助建站会员专属系统?  如何用手机制作网站和网页,手机移动端的网站能制作成中英双语的吗?  佐糖AI抠图怎样调整抠图精度_佐糖AI精度调整与放大细化操作【攻略】  Laravel请求验证怎么写_Laravel Validator自定义表单验证规则教程  如何快速辨别茅台真假?关键步骤解析  如何快速启动建站代理加盟业务?  高性能网站服务器配置指南:安全稳定与高效建站核心方案  Laravel路由Route怎么设置_Laravel基础路由定义与参数传递规则【详解】  个人网站制作流程图片大全,个人网站如何注销?  电商网站制作价格怎么算,网上拍卖流程以及规则?  装修招标网站设计制作流程,装修招标流程?  如何在阿里云部署织梦网站?  青岛网站建设如何选择本地服务器?  如何用VPS主机快速搭建个人网站?  iOS UIView常见属性方法小结  Laravel表单请求验证类怎么用_Laravel Form Request分离验证逻辑教程  VIVO手机上del键无效OnKeyListener不响应的原因及解决方法  如何有效防御Web建站篡改攻击?  Python企业级消息系统教程_KafkaRabbitMQ高并发应用  小米17系列还有一款新机?主打6.9英寸大直屏和旗舰级影像  谷歌浏览器下载文件时中断怎么办 Google Chrome下载管理修复  猎豹浏览器开发者工具怎么打开 猎豹浏览器F12调试工具使用【前端必备】  如何在宝塔面板中修改默认建站目录?  网站视频制作书签怎么做,ie浏览器怎么将网站固定在书签工具栏?  如何在 Telegram Web View(iOS)中防止键盘遮挡底部输入框  如何在阿里云ECS服务器部署织梦CMS网站?  Linux网络带宽限制_tc配置实践解析【教程】  通义万相免费版怎么用_通义万相免费版使用方法详细指南【教程】  如何基于云服务器快速搭建网站及云盘系统?  如何快速搭建个人网站并优化SEO?  Laravel怎么配置自定义表前缀_Laravel数据库迁移与Eloquent表名映射【步骤】  Laravel与Inertia.js怎么结合_使用Laravel和Inertia构建现代单页应用