<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
* {
font-family: 微软雅黑;
}
h1 {
text-align: center;
}
div {
width: 940px;
padding: 5px;
margin: 2px auto;
border: 1px solid #0094ff;
}
#tbData {
border: 1px solid #0094ff;
border-collapse: collapse;
width: 950px;
margin: 2px auto;
}
#tbData th {
color: #fff;
background-color: #0094ff;
}
#tbData th, td {
border: 1px solid #000;
padding: 5px;
text-align: center;
}
</style>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script src="MyTabble.js"></script>
<script type="text/javascript">
//1初始化表格对象，并显示到 父容器中
var colDef = [{ title: "序号", property: "id" },
{ title: "捐款人", property: "pname" },
{ title: "受捐单位", property: "orgId" },
{ title: "金额", property: "money" },
{ title: "受捐时间", property: "date" },
{
title: "操作", property: "btn",
formatter: function (datarow) {
return "<a href=‘javascript:void()‘ onclick=‘del(" + datarow.id + ")‘>操作</a>"
}
}
];
$(function () {
myTable.init("bo", colDef);
});
function del()
{
if (confirm("您确定要删除吗？"))
{
//
}
}
</script>
</head>
<body id="bo">
<h1>捐赠管理</h1>
<div>
受捐单位：
<select id="selSearchOrg">
<option value="-1">请选择</option>
</select>
<input type="button" id="btnSearch" value="查询" />
<input type="button" id="btnPre" value="上一页" />
<input type="button" id="btnNext" value="下一页" />
<span id="spanPageIndex"></span>/<span id="spanPageCount"></span>
</div>
<div>
捐赠人：<input type="text" id="txtName" />
受捐单位：<select id="selAddOrg"></select>
金额：<input type="text" id="txtMoney" />
受捐日期：<input type="text" id="txtDate" />
<input type="button" id="btnAdd" value="新增" />
</div>
</body>
</html>
原文：http://www.cnblogs.com/sumg/p/3787733.html