先绘制一个简单的表格,注意的是我们要把我们的个js和css文件放在我们的这个html的当前文件夹里面
-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> Content-Type" content="text/html; charset=utf-8" /> 我的第一个Grid表格 rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.8.11.custom.css" /> rel="stylesheet" type="text/css" media="screen" href="ui.jqgrid.css" /> <script src="" type="text/javascript"></script> <script src="" type="text/jscript"></script> <script src="" type="text/javascript"></script> <script src="" type="text/javascript"></script> <script type=""> $(function(){ jQuery("#list").jqGrid({ datatype: "local", height: 100, colNames:['姓名',' 学校', '年龄','出生地'], colModel:[ {name:'name',width:60}, {name:'class', width:90}, {name:'age', width:100}, {name:'addr', width:100} ], multiselect: true, caption: "招生信息" }); var mydata = [ {name:"张飞",class:"xx工业大学",age:"25",addr:"黄冈"}, {name:"刘邦",class:"xx工业大学",age:"26",addr:"黄冈"}, {name:"关羽",class:"xx工业大学",age:"27",addr:"黄冈"} ]; for(var i=0;i<=mydata.length;i++) jQuery("#list").jqGrid('addRowData',i+1,mydata[i]); }); </script> list">