效果图如下：

首先简单说明一下，后面会给所涉及到的代码都贴上来的。

1.excel图标是一个用户控件，用来触发下载

2.首页、上页......每页多少条，这一块是一个整体，你可以选择放置在表格下面，或者表格上面都可以

3.表格则也是单独的一个，自己任意设置位置

4.复选框是否显示，自己设置，并可设置绑定的值，并有自带的方法可供你用于获取选中的复选框的对象跟值

5.表格的单行、双行、点击、悬浮、标题栏、表格的样式，都可以通过设置参数来修改，图为自带的效果

6.分页默认每页10行，分页的检测、复选框选择的检测，都已封装好

7.每页显示的数量、以及跳转到第几页的事件也都已经写好

8.关于导出按钮的数据导出功能，数据查询的时候，将数据绑定到用户控件中，而导出按钮则用来检测是否有复选框，如果有复选框，则用来先检测用户选中的进行拼接导出

功能大概就上面这些了吧，先给调用的方法贴上来。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CommonTable.aspx.cs" Inherits="ChildrenPageFolder_CommonTable" %>

<%@ Register TagPrefix="uc" TagName="tn_export" Src="~/UserControl/DataExport.ascx" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>添加表格</title>

    <script src="../js/CommonHtmlOperation.js" type="text/javascript"></script>

    <script language="javascript" type="text/javascript">

        function PageInfoEvent() {

            var sql = "select count(*) from camera_fault t";

            var sqlQueryCount = ChildrenPageFolder_CommonTable.GetFaultCount(sql).value;    // 从后台获取一个总数

            CommonJS.HtmlTableOperation.LoadPageTool("div_PageInfo", sqlQueryCount, TableDataEvent);    // 调用分页加载的方法，传入：divID，总数，回调函数

        }

        function TableDataEvent(nowPage) {

            var sql = "select * from camera_fault t";

            var dt = ChildrenPageFolder_CommonTable.GetFault(sql, nowPage, CommonJS.HtmlTableOperation.ShowItemCount).value;    // 从后台获取数据，DataTable类型

            // 设置显示的列名，每一列绑定的值

            CommonJS.HtmlTableOperation.Fields = ["CF_TYPE:故障类型", "CF_CREATEUSERNAME:申报人姓名", "CF_CREATEUSERID:申报人ID", "CF_CREATETIME:申报时间"];

            CommonJS.HtmlTableOperation.SetCheckbox(true, "CF_CAMERAID"); // 设置是否显示复选框，以及复选框绑定那个列，传数据库的列名进去

            // 绑定行事件

            // CommonJS.HtmlTableOperation.trClickFun = trC;

            // CommonJS.HtmlTableOperation.trDblclickFun = trC;

            // CommonJS.HtmlTableOperation.trMouseFun = trC;

            // CommonJS.HtmlTableOperation.trOutFun = trC;

            CommonJS.HtmlTableOperation.LoadData("div_TableData", dt);          // 加载数据。传递 divID 以及 DataTable

        }

        // 获取用户选中的复选框的value值

        function GetCheckedValue() {

            CommonJS.HtmlTableOperation.GetCheckedValue("div_TableData");

        }

        // 行的方法，返回行对象

        function trC(obj) {

            alert(obj.innerHTML);

        }

    </script>

</head>

<body onload="PageInfoEvent();TableDataEvent(1);">

    <form id="form1" runat="server">

    <uc:tn_export runat="server" ID="uc_export" />

    <div id="div_PageInfo">

    </div>

    <div id="div_TableData">

    </div>

    </form>

</body>

</html>

简单说说代码的调用：
1.自己定义好两个div，一个用户控件。两个div呢，一个是放置上一页下一页的位置，另外一个div则用来放置table的位置，至于用户控件，放上来之后，可以隐藏，也可以显示，这个随意。

2.PageInfoEvent的三行代码，只需要理解第三行代码就够了，第二行的代码通过ajax从后台获取一个总数。而第三行代码则是调用封装的封装代码，你需要传入三个参数，一个参数是分页按钮显示的div的ID，之后就是总数，最后一个是回调函数，该回调函数是用来当分页触发之后调用的方法，封装的方法会返回一个页数回来。

3.TableDataEvent事件中，获取页数。从后台查询该页的数据

之后里面有各种参数设置，比如：显示的列名、每个列对应绑定的数据列、是否显示复选框、复选框绑定哪个列、设置每页显示的数量、行的单击双击悬浮离开事件的绑定、表格的颜色，皆可自定义设置，当然，你若不设置，也都可以，都有默认值。

4.此处需要注意的是：数据类型暂时限制了C#中的DataTable类型，因为现有的项目全是这个类型的，所以先用这个数据类型来写这个例子，如果要用其它类型，自己改代码

5.后面还有两个方法，一个是GetCheckedValue，是获取用户选中的值。TrC呢，是在加载table数据的时候，你绑定了回调方法，那么就在回调的时候，将当前行的对象返回给你自定义

下面是自己封装好的JS方法了

/// <summary>

/// table 控件操作方式

/// <summary>

var CommonJS = {};

CommonJS.HtmlTableOperation = (function () {

    /// <summary>

    /// 静态公有方法跟属性

    /// <summary>

    var TableEvent = {

        // 表格涉及到的样式

        tableCss: "font-size:13px;",

        trTitleCss: "text-align:center; COLOR: white; BACKGROUND-COLOR: #5d7b9d;",

        trCss1: "color: #000000;background-color: #ffffee;",

        trCss2: "color: #993300;background-color: #ffffaa;",

        trMouseCss: "color: #123456;background-color: #eaa;",

        trClickCss: "color: white;background-color: #6060F4;",

        /// <summary>

        /// 设置需要初始化的变量

        /// <summary>

        Fields: new Array(),        // 需要显示的字段，表列名

        DispField: new Array(),     // 需要显示的字段，中文名

        ShowItemCount: 10,          // 设置每页显示的数量

        // 是否显示复选框以及复选框绑定的字段

        IsShowCheckbox: false,

        CheckboxField: "",

        SetCheckbox: function (isShow, field) {

            this.IsShowCheckbox = isShow;

            this.CheckboxField = field;

        },

        trClickFun: null,

        trDblclickFun: null,

        trMouseFun: null,

        trOutFun: null,

        /// <summary>

        /// 加载表格数据

        /// <summary>

        LoadData: function (divId, dt) {

            if (dt != null && dt != undefined) {

                document.getElementById(divId).innerHTML = "";

                var excelHead = "";

                var excelBody = "";

                // 整理好显示的列

                if (this.Fields.length == 0) {

                    for (var i = 0; i < dt.Columns.length; i++) {

                        this.DispField.push(dt.Columns[i].Name);

                    }

                    this.Fields = this.DispField;

                } else {

                    var temFields = new Array();

                    var temDispField = new Array();

                    for (var i = 0; i < this.Fields.length; i++) {

                        temFields.push(this.Fields[i].split(":")[0]);

                        temDispField.push(this.Fields[i].split(":")[1]);

                    }

                    this.Fields = temFields;

                    this.DispField = temDispField;

                }

                // 确定是否需要显示复选框

                var td_ckAll = null;

                var ck_CheckboxAll = null;

                var ck_checkboxIdAll = tableCheckboxAllId = divId + "_CheckboxAll";

                var ck_checkboxItemName = tableCheckboxItemName = divId + "_CheckboxItem";

                if (this.IsShowCheckbox) {

                    ck_CheckboxAll = CreateElement("input");

                    ck_CheckboxAll.type = "checkbox";

                    ck_CheckboxAll.title = "全选/全不选";

                    ck_CheckboxAll.id = ck_checkboxIdAll;

                    ck_CheckboxAll.setAttribute("checkboxItemName", ck_checkboxItemName);

                    ck_CheckboxAll.onclick = function (e) { TableCheckboxCheckAll(this); }

                    td_ckAll = CreateElement("td");

                    td_ckAll.appendChild(ck_CheckboxAll);

                }

                // 创建表格的标题行

                var thead = CreateElement("thead");

                var thead_tr = CreateElement("tr");

                thead_tr.style.cssText = this.trTitleCss;

                if (this.IsShowCheckbox) { thead_tr.appendChild(td_ckAll); }

                for (var i = 0; i < this.DispField.length; i++) {

                    var thead_tr_td = CreateElement("td");

                    thead_tr_td.innerHTML = this.DispField[i];

                    thead_tr.appendChild(thead_tr_td);

                    excelHead += this.DispField[i] + "\t";

                }

                thead.appendChild(thead_tr);

                // 创建表格的数据行

                var tbody = CreateElement("tbody");

                for (var i = 0; i < dt.Rows.length && i < this.ShowItemCount; i++) {

                    var tbody_tr = CreateElement("tr");

                    var tr_titleMsg = "";

                    if (this.IsShowCheckbox) {

                        // 复选框

                        var ck_CheckboxItem = CreateElement("input");

                        ck_CheckboxItem.type = "checkbox";

                        ck_CheckboxItem.id = ck_checkboxItemName;

                        ck_CheckboxItem.name = ck_checkboxItemName;

                        ck_CheckboxItem.setAttribute("checkboxAllId", ck_checkboxIdAll);

                        ck_CheckboxItem.value = dt.Rows[i][this.CheckboxField] == undefined ? "" : dt.Rows[i][this.CheckboxField];

                        ck_CheckboxItem.onclick = function () { TableCheckboxCheck(this); }

                        var tbody_tr_td_checkbox = CreateElement("td");

                        tbody_tr_td_checkbox.appendChild(ck_CheckboxItem);

                        tbody_tr.appendChild(tbody_tr_td_checkbox);

                    }

                    // 数据内容

                    for (var j = 0; j < this.Fields.length; j++) {

                        var tbody_tr_td = CreateElement("td");

                        tbody_tr_td.innerHTML = dt.Rows[i][this.Fields[j]];

                        tbody_tr.appendChild(tbody_tr_td);

                        tr_titleMsg += this.DispField[j] + ":" + dt.Rows[i][this.Fields[j]] + "\r\n";

                        excelBody += tbody_tr_td.innerHTML + "\t";

                    }

                    excelBody += "\n";

                    tbody_tr.title = tr_titleMsg.substring(0, tr_titleMsg.length - 2);        // 添加行的title提示内容

                    if (i % 2 == 1) { tbody_tr.style.cssText = this.trCss2; } else { tbody_tr.style.cssText = this.trCss1; }

                    tbody_tr.setAttribute("trNowClass", tbody_tr.style.cssText);

                    // 数据行的事件绑定

                    tbody_tr.onclick = function () { trClickEvent(this); }

                    tbody_tr.ondblclick = function () { trDblclickEvent(this); }

                    tbody_tr.onmouseover = function () { trMouseEvent(this); }

                    tbody_tr.onmouseout = function () { trOutEvent(this); }

                    tbody.appendChild(tbody_tr);

                }

                // 将拼接的内容放置到表格中，并添加到页面

                var table = CreateElement("table");

                table.style.cssText = this.tableCss;

                table.appendChild(thead);

                table.appendChild(tbody);

                document.getElementById(divId).appendChild(table);

                BindExcelExportData(excelHead, excelBody);

            }

        },

        /// <summary>

        /// 加载分页信息

        /// <summary>

        LoadPageTool: function (divId, itemCount, callback) {

            var pageDivObject = document.getElementById(divId);

            var buttonCss = "padding:2px; margin:2px; ";

            var spanCss = "padding:2px; font-size:13px; ";

            // 页码

            {

                var spanInfo = CreateElement("span");

                spanInfo.id = "span_" + divId;

                var pageCount = Math.floor(itemCount / this.ShowItemCount)

                if (itemCount % this.ShowItemCount != 0) { pageCount++; }

                spanInfo.setAttribute("attr_PageCount", pageCount);

                spanInfo.setAttribute("attr_NowPage", 1);

                spanInfo.setAttribute("attr_ItemCount", itemCount);

                spanInfo.setAttribute("attr_PageItemCount", this.ShowItemCount);

                spanInfo.setAttribute("attr_TxtNowPage", "txt_NowPage_" + divId);

                var spanInfo1 = CreateElement("span");

                spanInfo1.innerHTML = "当前第";

                var spanInfo2 = CreateElement("span");

                spanInfo2.innerHTML = "/" + pageCount + "页&nbsp;共" + itemCount + "项";

                var txtNowPage = CreateElement("input");

                txtNowPage.id = "txt_NowPage_" + divId;

                txtNowPage.type = "text";

                txtNowPage.size = 2;

                txtNowPage.value = 1;

                txtNowPage.title = "输入数值后按回车键触发";

                txtNowPage.style.cssText = "font-weight: bold;color: Blue; text-align: center;";

                txtNowPage.onkeyup = function () { this.value = this.value.replace(/\D/g, ''); }

                txtNowPage.onafterpaste = function () { this.value = this.value.replace(/\D/g, ''); }

                txtNowPage.onblur = function () { alert("离开事件"); }

                spanInfo.style.cssText = spanCss;

                spanInfo.appendChild(spanInfo1);

                spanInfo.appendChild(txtNowPage);

                spanInfo.appendChild(spanInfo2);

                var spanPageItemCount = CreateElement("span");

                var spanPageItemCount1 = CreateElement("span");

                spanPageItemCount1.innerHTML = "&nbsp;每页显示";

                var spanPageItemCount2 = CreateElement("span");

                spanPageItemCount2.innerHTML = "条";

                var txtPageItemCount = CreateElement("input");

                txtPageItemCount.type = "text";

                txtPageItemCount.size = 2;

                txtPageItemCount.value = this.ShowItemCount;

                txtPageItemCount.title = "输入数值后按回车键触发";

                txtPageItemCount.style.cssText = "font-weight: bold;color: Blue; text-align: center;";

                txtPageItemCount.onkeyup = function () { this.value = this.value.replace(/\D/g, ''); }

                txtPageItemCount.onafterpaste = function () { this.value = this.value.replace(/\D/g, ''); }

                txtPageItemCount.onblur = function () { UpdateItemCount(divId, itemCount, this.value, callback); }

                spanPageItemCount.style.cssText = spanCss;

                spanPageItemCount.appendChild(spanPageItemCount1);

                spanPageItemCount.appendChild(txtPageItemCount);

                spanPageItemCount.appendChild(spanPageItemCount2);

            }

            // 按钮

            {

                var btnFirst = CreateElement("input");

                btnFirst.type = "button";

                btnFirst.value = "首页";

                btnFirst.title = btnFirst.value;

                btnFirst.id = divId + "_FirstButtonId";

                btnFirst.style.cssText = buttonCss;

                btnFirst.onclick = function (e) { PageEvent(spanInfo, "first", callback); }

                var btnPre = CreateElement("input");

                btnPre.type = "button";

                btnPre.value = "上页";

                btnPre.title = btnPre.value;

                btnPre.style.cssText = buttonCss;

                btnPre.onclick = function (e) { PageEvent(spanInfo, "pre", callback); }

                var btnNext = CreateElement("input");

                btnNext.type = "button";

                btnNext.value = "下页";

                btnNext.title = btnNext.value;

                btnNext.style.cssText = buttonCss;

                btnNext.onclick = function (e) { PageEvent(spanInfo, "next", callback); }

                var btnEnd = CreateElement("input");

                btnEnd.type = "button";

                btnEnd.value = "尾页";

                btnEnd.title = btnEnd.value;

                btnEnd.style.cssText = buttonCss;

                btnEnd.onclick = function (e) { PageEvent(spanInfo, "end", callback); }

                var btnExport = CreateElement("input");

                btnExport.type = "button";

                btnExport.value = "导出";

                btnExport.title = btnEnd.value;

                btnExport.style.cssText = buttonCss;

                btnExport.onclick = function (e) { DataExportToExcel(); }

            }

            pageDivObject.innerHTML = "";

            pageDivObject.appendChild(btnFirst);

            pageDivObject.appendChild(btnPre);

            pageDivObject.appendChild(btnNext);

            pageDivObject.appendChild(btnEnd);

            pageDivObject.appendChild(btnExport);

            pageDivObject.appendChild(CreateElement("br"));

            pageDivObject.appendChild(spanInfo);

            pageDivObject.appendChild(spanPageItemCount);

        },

        /// <summary>

        /// 获取用户选中的项

        /// <summary>

        GetCheckedValue: function (divId) { return divId + "_CheckboxItem"; }

    };

    /// <summary>

    /// 私有属性

    /// <summary>

    {

        // 绑定为当前选中的行，用来行变色使用

        var trClickRowObject = null;

        // 表格的全选复选框ID跟数据的复选框NAME

        var tableCheckboxAllId = "";

        var tableCheckboxItemName = "";

    }

    /// <summary>

    /// 私有方法

    /// <summary>

    {

        /// <summary>

        /// 分页及复选框使用的方法

        /// <summary>

        {

            /// <summary>

            /// 当更换每页显示的数量时

            /// <summary>

            var UpdateItemCount = function (divId, itemCount, pageItemCount, callback) {

                CommonJS.HtmlTableOperation.ShowItemCount = pageItemCount;

                CommonJS.HtmlTableOperation.LoadPageTool(divId, itemCount, callback);

                callback(1);

            }

            /// <summary>

            /// 页面跳转检测

            /// <summary>

            var PageEvent = function (spanPage, type, callback) {

                var pageCount = spanPage.getAttribute("attr_PageCount");

                var nowPage = spanPage.getAttribute("attr_NowPage");

                var itemCount = spanPage.getAttribute("attr_ItemCount");

                var pageItemCount = spanPage.getAttribute("attr_PageItemCount");

                var txtNowPage = spanPage.getAttribute("attr_TxtNowPage");

                var newPage = nowPage;

                switch (type) {

                    case "first": if (nowPage == 1) { alert("已经是首页！"); return; } else { nowPage = 1; } break;

                    case "pre": if (nowPage - 1 < 1) { alert("已经是首页！"); return; } else { nowPage = nowPage - 1; } break;

                    case "next": if (nowPage + 1 > pageCount) { alert("已经是尾页！"); return; } else { nowPage = nowPage + 1; } break;

                    case "end": if (nowPage == pageCount) { alert("已经是尾页！"); return; } else { nowPage = pageCount; } break;

                }

                spanPage.setAttribute("attr_NowPage", nowPage);

                // spanPage.innerHTML = "当前第" + nowPage + "/" + pageCount + "页&nbsp;共" + itemCount + "项";

                document.getElementById(txtNowPage).value = nowPage;

                // 回调，返回用户需要的参数

                callback(nowPage);

            }

            /// <summary>

            /// 全选按钮事件、单个复选框点击

            /// <summary>

            var TableCheckboxCheckAll = function (obj) {

                var cks = document.getElementsByName(obj.getAttribute("checkboxItemName"));

                for (var i = 0; i < cks.length; i++) { cks[i].checked = obj.checked; }

            }

            var TableCheckboxCheck = function (obj) {

                var ckAllObj = document.getElementById(obj.getAttribute("checkboxAllId"));

                var ckNames = document.getElementsByName(obj.name);

                for (var i = 0; i < ckNames.length; i++) {

                    ckAllObj.checked = ckNames[i].checked

                    if (!ckNames[i].checked) { break; }

                }

            }

        }

        /// <summary>

        /// 数据行涉及的事件：单击、双击、悬浮、离开...

        /// <summary>

        {

            function trClickEvent(trObj) {

                if (trClickRowObject != trObj && trClickRowObject != null) {

                    trClickRowObject.style.cssText = trClickRowObject.getAttribute("trNowClass");

                }

                trObj.style.cssText = CommonJS.HtmlTableOperation.trClickCss;

                trClickRowObject = trObj

                if (CommonJS.HtmlTableOperation.trClickFun != null) {

                    CommonJS.HtmlTableOperation.trClickFun(trObj);

                }

            }

            function trDblclickEvent(trObj) {

                if (CommonJS.HtmlTableOperation.trDblclickFun != null) {

                    CommonJS.HtmlTableOperation.trDblclickFun(trObj);

                }

            }

            function trMouseEvent(trObj) {

                if (trClickRowObject != trObj) {

                    trObj.style.cssText = CommonJS.HtmlTableOperation.trMouseCss;

                }

                if (CommonJS.HtmlTableOperation.trMouseFun != null) {

                    CommonJS.HtmlTableOperation.trMouseFun(trObj);

                }

            }

            function trOutEvent(trObj) {

                if (trClickRowObject != trObj) {

                    trObj.style.cssText = trObj.getAttribute("trNowClass");

                }

                if (CommonJS.HtmlTableOperation.trOutFun != null) {

                    CommonJS.HtmlTableOperation.trOutFun(trObj);

                }

            }

        }

        /// <summary>

        /// 将查询出来的数据绑定到导出的隐藏变量中

        /// <summary>

        function BindExcelExportData(headStr, bodyStr) {

            //            var ucFn = document.getElementById("uc_export_hf_fileName");

            //            if (ucFn != null && ucFn != undefined) {

            //                var fileName = "Excel_" + (new Date()).toLocaleDateString() + ".xls";

            //                fileName.replace("年", "_").replace("月", "_").replace("日", "");

            //                document.getElementById("uc_export_hf_fileName").value = fileName;

            //            }

            var ucH = document.getElementById("uc_export_hf_headStr");

            if (ucH != null && ucH != undefined) {

                document.getElementById("uc_export_hf_headStr").value = headStr;

            }

            var ucB = document.getElementById("uc_export_hf_bodyStr");

            if (ucB != null && ucB != undefined) {

                document.getElementById("uc_export_hf_bodyStr").value = bodyStr;

            }

        }

        function DataExportToExcel() {

            // 检测用户选中项

            var ckAll = document.getElementById(tableCheckboxAllId);

            var cks = document.getElementsByName(tableCheckboxItemName);

            if (ckAll != null) {

                var headStr = GetCheckedRowStr(ckAll);

                var bodyStr = "";

                if (ckAll.checked) {

                    for (var i = 0; i < cks.length; i++) { bodyStr += GetCheckedRowStr(cks[i]) + "\n"; }

                } else {

                    for (var i = 0; i < cks.length; i++) { if (cks[i].checked) { bodyStr += GetCheckedRowStr(cks[i]) + "\n"; } }

                }

                BindExcelExportData(headStr, bodyStr);

            }

            // 调用下载事件

            var ucD = document.getElementById("uc_export_img_downExcel");

            if (ucD != null && ucD != undefined) {

                document.getElementById("uc_export_img_downExcel").click();

            }

        }

        function GetCheckedRowStr(ckObj) {

            var textArr = ckObj.parentElement.parentElement.childNodes;

            var trStr = "";

            for (var i = 1; i < textArr.length; i++) {

                trStr += textArr[i].innerText + "\t";

            }

            return trStr;

        }

        /// <summary>

        /// 创建节点对象

        /// <summary>

        var CreateElement = function (elementName) { return document.createElement(elementName); }

    }

    return TableEvent;

})();

下面的是ajax调用的后台的两个方法，一个是获取总数，一个是获取数据

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

public partial class ChildrenPageFolder_CommonTable : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        AjaxPro.Utility.RegisterTypeForAjax(typeof(ChildrenPageFolder_CommonTable));

    }

    /// <summary>

    /// 执行传入的sql获取报障的数据

    /// </summary>

    /// <param name="sql"></param>

    /// <returns></returns>

    [AjaxPro.AjaxMethod]

    public DataTable GetFault(string sql, int pageNum, int itemCount)

    {

        int beginNum = (pageNum - 1) * itemCount;

        int endNum = pageNum * itemCount;

        string fenyeSql = "select * from(select a.*,rownum r from (" + sql + ") a where rownum <= " + endNum + ") b where r > " + beginNum;

        DataTable dt = DataAccessManager.GetDataTable(fenyeSql, "PGISAPP");

        return dt;

    }

    /// <summary>

    /// 统计sql的总数

    /// </summary>

    /// <param name="sql"></param>

    /// <returns></returns>

    [AjaxPro.AjaxMethod]

    public int GetFaultCount(string sql)

    {

        int count = DataAccessManager.GetItemsCount(sql, "PGISAPP");

        return count;

    }

}

接下来的两个是用户控件的前台代码跟后台代码

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="DataExport.ascx.cs" Inherits="UserControl_DataExport" %>

<asp:ImageButton ID="img_downExcel" runat="server"

    ImageUrl="~/images/excel.png" ToolTip="导出Excel"

    Width="26px" Height="26px" ImageAlign="AbsMiddle"

    onclick="img_downExcel_Click" />

    <asp:HiddenField ID="hf_fileName" runat="server" Value="" />

    <asp:HiddenField ID="hf_headStr" runat="server" Value="" />

    <asp:HiddenField ID="hf_bodyStr" runat="server" Value="" />
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class UserControl_DataExport : System.Web.UI.UserControl

{

    protected void Page_Load(object sender, EventArgs e)

    {

    }

    /// <summary>

    ///

    /// </summary>

    protected void img_downExcel_Click(object sender, ImageClickEventArgs e)

    {

        try

        {

            // 创建标题行

            string excelHead = "";

            string[] dhs = new string[] { "标题1", "标题2" };

            for (int i = 0; i < dhs.Length; i++)

            {

                excelHead += dhs[i] + "\t";

            }

            // 创建数据行

            string excelBody = "";

            for (int i = 0; i < 2; i++)

            {

                for (int j = 0; j < 10; j++)

                {

                    excelBody += "" + j + "\t";

                }

                excelBody += "\n";

            }

            excelHead = this.hf_headStr.Value;

            excelBody = this.hf_bodyStr.Value;

            DownExcel(excelHead, excelBody);

        }

        catch (Exception ex)

        {

        }

    }

    /// <summary>

    /// Excel下载输出

    /// </summary>

    /// <param name="fileName">文件名称</param>

    /// <param name="headStr">标题栏</param>

    /// <param name="bodyStr">内容主体</param>

    public void DownExcel(string headStr,string bodyStr)

    {

        // 文件名称

        string fileName = "Excel_" + System.DateTime.Now.ToShortDateString() + ".xls"; // 或者 .et

        Response.Clear();

        Response.Buffer = true;

        System.IO.StringWriter sw = new System.IO.StringWriter();

        sw.WriteLine(headStr);

        sw.WriteLine(bodyStr);

        sw.Close();

        Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName);

        Response.ContentType = "application/ms-excel";

        Response.ContentEncoding = System.Text.Encoding.GetEncoding("GB2312");

        Response.Write(sw);

        Response.End();

    }

}

Javascript加载talbe(包含分页、数据下载功能)的更多相关文章

  1. jqgrid 分页时，清空原表格数据加载返回的新数据

    由于,我们是动态分页,分页后的数据是在触发分页后动态加载而来.如何使jqgrid清空原数据而加载新数据? 1)调用jqgrid的 clearGridData 方法清空表格数据 2)调用jqgrid的  ...

  2. KnockoutJS 3.X API 第七章 其他技术(1) 加载和保存JSON数据

    Knockout允许您实现复杂的客户端交互性,但几乎所有Web应用程序还需要与服务器交换数据,或至少将本地存储的数据序列化. 最方便的交换或存储数据的方式是JSON格式 - 大多数Ajax应用程序今天 ...

  3. Knockout应用开发指南 第六章：加载或保存JSON数据

    原文:Knockout应用开发指南 第六章:加载或保存JSON数据 加载或保存JSON数据 Knockout可以实现很复杂的客户端交互,但是几乎所有的web应用程序都要和服务器端交换数据(至少为了本地 ...

  4. 怎么样加快JavaScript加载和执行效率

    概览 无论当前 JavaScript 代码是内嵌还是在外链文件中,页面的下载和渲染都必须停下来等待脚本执行完成.JavaScript 执行过程耗时越久,浏览器等待响应用户输入的时间就越长.浏览器在下载 ...

  5. [转]微信小程序之加载更多（分页加载）实例 —— 微信小程序实战系列（2）

    本文转自;http://blog.csdn.net/michael_ouyang/article/details/56846185 loadmore 加载更多(分页加载) 当用户打开一个页面时,假设后 ...

  6. 第六章：加载或保存JSON数据

    加载或保存JSON数据 Knockout可以实现很复杂的客户端交互,但是几乎所有的web应用程序都要和服务器端交换数据(至少为了本地存储需要序列化数据),交换数据最方便的就是使用JSON格式 – 大多 ...

  7. Smart3D系列教程7之 《手动配置S3C索引加载全部的瓦片数据》

    一.前言 迄今为止,Wish3D已经出品推出了6篇系列教程,从倾斜摄影的原理方法.采集照片的技巧.Smart3D各模块的功能应用.小物件的照片重建.大区域的地形重建到DSM及正射影像的处理生产,立足于 ...

  8. JSBinding + SharpKit / JavaScript 加载流程

    首先,现在的方案是游戏启动就加载全部的 JavaScript 代码. 先看下 StreamingAssets/JavaScript/ 文件夹下的目录结构:

  9. Javascript加载速度慢解决办法

    通常我们的网站里面会加载一些js代码,统计啊,google广告啊,百度同盟啊,阿里妈妈广告代码啊,一堆,最后弄得页面加载速度很慢,很慢.解决办法:换一个js包含的方式,让javascript加载速度倍 ...

随机推荐

  1. 2018-2-13-win10-uwp-如何拖动一个TextBlock的文字到另一个TextBlock-

    title author date CreateTime categories win10 uwp 如何拖动一个TextBlock的文字到另一个TextBlock lindexi 2018-2-13 ...

  2. 文件IO 例子

    例子1: 测试最多打开多少个文件 #include <stdio.h> #include <sys/types.h> #include <sys/stat.h> # ...

  3. 压缩与解压缩 gzip bzip2 tar 命令

    gzip压缩与解压缩 命令  gzip -v   解压缩 gzip-d 操作如下. 压缩 .可以看到源文件有5171大小,压缩后,变成了1998大小. 解压缩 .解压缩之后可以看到,原来的man_db ...

  4. 【学术篇】2.28测试T2 线段 拓扑排序

    题目: 思路: 看到这种找前后的题目... 第一反应就是拓扑排序_(:з」∠)_ 每条线段都有左右两个端点咯, 然后就乱搞吧.. 我们用\(i\)和\(i'\)分别表示第\(i\)条线段的左右端点.. ...

  5. docker 命令操作

    1.停止所有的container,这样才能够删除其中的images: docker stop $(docker ps -a -q) 如果想要删除所有container的话再加一个指令: docker ...

  6. 排列+函数映射——hdu6038好题

    /* 引理:[0,n-1]的排列,i向a[i]连边,那么每个数必定在一个环中 所以数组a可以分割成一些环,数组b也可以分割成一些环 先讨论a的一个环 a[a1]=a2 a[a2]=a3 a[a3]=a ...

  7. Java语法清单-快速回顾(开发)

    Java CheatSheet 01.基础 hello,world! public static void main(String[] args) { System.out.println(" ...

  8. 50 ubuntu下pcl编译以及用 VSCode配置pcl / opencv开发环境

    0 引言 最近在VSCode下搞开发,于是将pcl库迁移到这个环境下,用来跑一些依赖pcl的开源的代码以及自己做一些快速开发等. 1 pcl编译 主要参考了这篇博客,链接如下. https://blo ...

  9. 37 VTK中的坐标系系统

    0 引言 在利用PCL的交互功能解决尺寸关联几何的指定问题时,涉及到一些显示上的操作.目前的需求是:将投影到注释平面上的点云,以与屏幕平齐的方式,显示在屏幕正中,这样方便用户进行操作.但是,在运用se ...

  10. P1624 单词缩写

    P1624 单词缩写 题目描述 树树发现好多计算机中的单词都是缩写,如GDB是全称Gnu DeBug的缩写.但是,有时候缩写对应的全称会不固定,如缩写LINUX可以理解为: (1) LINus’s U ...