<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 引入 jQuery 和 jqGrid 相关的库和样式 --><script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" /><script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.5/jquery.jqgrid.min.js"></script><link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.5/css/ui.jqgrid.min.css" /><title>jqGrid Example with Data</title></head><body><table id="grid"></table><script>
// 定义您的数据数组
var myData = [
{ VendorName: "A", UnRate: 1, UnCount: 2 },
{ VendorName: "B", UnRate: 11, UnCount: 22 },
{ VendorName: "C", UnRate: 33, UnCount: 44 },
];
// 初始化 jqGrid
$("#grid").jqGrid({
datatype: "local",
data: myData,
colModel: [
{ name: "VendorName", label: "Vendor Name", width: 100 },
{ name: "UnRate", label: "UnRate", width: 100 },
{ name: "UnCount", label: "UnCount", width: 100 },
],
rowNum: 1,
rowList: [1, 2, 3],
viewrecords: true,
caption: "Example with Data",
pager: true
});
// 设置自动翻页
var autoPagingInterval = 3000; // 翻页间隔时间（以毫秒为单位），设置为 3 秒
setInterval(function() {
var grid = $("#grid");
var currentPage = grid.jqGrid('getGridParam', 'page'); // 获取当前页号
var totalPages = grid.jqGrid('getGridParam', 'lastpage'); // 获取总页数
var nextPage = currentPage < totalPages ? currentPage + 1 : 1; // 计算下一页号
grid.jqGrid('setGridParam', { page: nextPage }).trigger("reloadGrid");
}, autoPagingInterval);
</script></body></html>
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 震惊！C++程序真的从main开始吗？99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾（3.3-3.9）
· winform 绘制太阳，地球，月球 运作规律