JQuery中dataGrid设置行的高度示例代码

在jQuery中，如果你正在使用某个特定的数据网格（dataGrid）插件（比如jqGrid、DataTables等），设置行的高度通常依赖于该插件的API或配置选项。由于jQuery本身不直接提供名为"dataGrid"的组件，我将提供一个通用的示例，这里以jqGrid为例，因为它是jQuery生态系统中一个流行的数据网格插件。

对于jqGrid，你可以通过`rowNum`属性来控制每页显示的行数，但这并不直接设置行的高度。行的高度通常由CSS样式控制。你可以通过修改CSS来调整行的高度。

下面是一个简单的示例，展示如何通过CSS来设置jqGrid中行的高度：


<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" media="screen" href="https://cdn.jsdelivr.net/npm/jqgrid/css/ui.jqgrid.css" />
    <style>
        /* 设置jqGrid表格中行的高度 */
        .ui-jqgrid tr.jqgrow td {
            height: 50px; /* 将行高设置为50px */
            line-height: 50px; /* 调整行内文本的垂直居中 */
        }
    </style>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jqgrid/js/jquery.jqGrid.min.js"></script>
</head>
<body>

<table id="list"></table>
<div id="pager"></div>

<script type="text/javascript">
$(document).ready(function(){
    $("#list").jqGrid({
        url:'your_data_source.json', // 替换为你的数据源
        datatype: "json",
        colModel:[
            {label:'ID',name:'id',index:'id',width:55},
            {label:'Name',name:'name',index:'name',width:90},
            // 添加更多的列配置...
        ],
        rowNum:10, // 每页显示行数
        rowList:[10,20,30], // 分页选项
        pager: '#pager',
        sortname: 'id',
        viewrecords: true,
        sortorder: "asc",
        caption:"示例jqGrid"
    });
});
</script>

</body>
</html>

在这个示例中，我通过CSS选择器`.ui-jqgrid tr.jqgrow td`来选中jqGrid中所有的行单元格，并设置了`height`和`line-height`属性来调整行的高度和行内文本的垂直居中。

请注意，你需要将`'your_data_source.json'`替换为你的实际数据源URL，并确保jqGrid的CSS和JS文件已正确加载。此外，根据你的具体需求，可能还需要调整其他jqGrid的配置选项。