jquery easyUI 中datagrid单元格的合并

最新推荐文章于 2024-12-29 06:12:56 发布

原创最新推荐文章于 2024-12-29 06:12:56 发布 · 8.7k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#datagrid #jquery #function #stylesheet #table #html

javascript 同时被 2 个专栏收录

2 篇文章

订阅专栏

jQuery

1 篇文章

订阅专栏

本文介绍了一个使用jQuery EasyUI实现的数据表格(DataGrid)示例，包括如何通过JavaScript自定义函数实现单元格合并，以及如何配置DataGrid的各项属性如分页、排序等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

datagrid.html ：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jQuery EasyUI</title> <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css" mce_href="themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="../themes/icon.css" mce_href="themes/icon.css"> <mce:script type="text/javascript" src="../jquery-1.4.2.min.js" mce_src="jquery-1.4.2.min.js"></mce:script> <mce:script type="text/javascript" src="../jquery.easyui.min.js" mce_src="jquery.easyui.min.js"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <h1>DataGrid</h1> <table id="test"></table> </body> </html>

datagrid_data.json:

{ "total":239, "rows":[ {"code":"001","name":"Name 1","addr":"Address 11","col4":"col4 data"}, {"code":"001","name":"Name 1","addr":"Address 13","col4":"col4 data"}, {"code":"001","name":"Name 3","addr":"Address 11","col4":"col4 data"}, {"code":"004","name":"Name 4","addr":"Address 63","col4":"col4 data"}, {"code":"005","name":"Name 5","addr":"Address 45","col4":"col4 data"}, {"code":"005","name":"Name 6","addr":"Address 16","col4":"col4 data"}, {"code":"005","name":"Name 6","addr":"Address 27","col4":"col4 data"}, {"code":"005","name":"Name 8","addr":"Address 81","col4":"col4 data"}, {"code":"009","name":"Name 9","addr":"Address 69","col4":"col4 data"}, {"code":"010","name":"Name 10","addr":"Address 78","col4":"col4 data"} ] }