本文将介绍ashx和html的联合使用方法，尽管目前流行mvc，但handler一般处理程序还是ASP.NET的基础知识，结合html页面，做出来的网页绝对比WebForm的简洁和效率高。

首先，概要说明一下：

html是过去非常老的一种网页格式，属于静态网页，要想在html上呈现SQL Server上的数据，只能依靠ashx了。

大概的方法是，利用html作为模板，使用ashx读取数据库，替换html中的部分内容，最终显示已替换的html内容。

先给个效果图：

下面开始上代码：

首先做用visual studio，新建一个项目，项目下再新建有footer.htm，header.htm，Index.ashx，Index.htm

另外我已做了一个简单的选取表格信息，显示在input标签中的功能，所以我也用到了jquery.min.js

（屏蔽部分请忽略，是我做的另一个静态页面，与本例无关）

1、首先看的是Index.htm的静态网页代码：

 <!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>

     <title>首页</title>

     <style type="text/css">

         body

         {

             width: 1000px;

         }

         table

         {

             width: 300px;

             text-align: center;

         }

         table th

         {

             text-align: center;

         }

         button

         {

             background-color: Transparent;

         }

     </style>

     <script src="jquery-1.8.2.min.js" type="text/javascript"></script>

     <script>

     function select(obj){

         var $btn=$(obj);

         $("#col1").val($btn.parent().prev().prev().html());

         $("#col2").val($btn.parent().prev().html());

     }

     </script>

 </head>

 <body>

     $header

     <table class="table table-hover" border="1" cellpadding="0px" cellspacing="0px">

         <tr>

             <th>

                 col1

             </th>

             <th>

                 col2

             </th>

             <th>

                 col3

             </th>

         </tr>

         $content

     </table>

     <br />

     <input id="col1" type="text" />

     <input id="col2" type="text" />

     $footer

 </body>

 </html>

上图中，第5行至23行<style>是简单样式，

第27行至33行<script>是javascript代码，用于把table中选中的内容填入到input中，
第37行$header和第55行$footer是页头和页尾的标记，后续会使用另外2个html网页替换之，

中间的table创建了3个列头，分别是col1,col2,col3，$content是table的主体部分，后续会在Index.ashx中替换之。

2、接着是header.htm：

 <h2>

     Title

 </h2>

footer.htm：

 <hr />

 CopyRight &copy; XXX

非常的简单，就是标题和版权信息。

3、最后是Index.ashx：

 using System;

 using System.Collections;

 using System.Data;

 using System.Linq;

 using System.Web;

 using System.Web.Services;

 using System.Web.Services.Protocols;

 using System.Xml.Linq;

 using System.IO;

 namespace AshxTest

 {

     /// <summary>

     /// $codebehindclassname$ 的摘要说明

     /// </summary>

     [WebService(Namespace = "http://tempuri.org/")]

     [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

     public class Index : IHttpHandler

     {

         public void ProcessRequest(HttpContext context)

         {

             //定义最终响应的文本内容的显示方式，这里使用html，所以是"text/html"

             context.Response.ContentType = "text/html";

             //分别把Index.htm,header.htm,footer.htm中的文本内容赋值给3个string变量，是完整的文本内容

             //AppDomain.CurrentDomain.BaseDirectory则是指项目的根目录，由于本例的网页都放在根目录下，没有文件夹

             string html = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "Index.htm");

             string header = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "header.htm");

             string footer = File.ReadAllText(AppDomain.CurrentDomain.BaseDirectory + "footer.htm");

             //定义table主体内容的string变量为content

             string content = "";

             //简单的for循环10次，把i与abc组合，填入到table的tr td标签中

             for (int i = 1; i <; i++)

             {

                 content += string.Format("<tr><td>{0}</td><td>{1}</td><td><button value='select' onclick='select(this);'>选择</button></td></tr>", "a" + i, "b" + i);

             }

             //以Index.htm的文本内容为基础，根据标记$header,$content,$footer分别替换上面的3个变量

             html = html.Replace("$header", header).Replace("$content", content).Replace("$footer", footer);

             //最终得到的html是完整的html前端代码，通过context.Response.Write输出到浏览器中

             context.Response.Write(html);

         }

         public bool IsReusable

         {

             get

             {

                 return false;

             }

         }

     }

 }

注释都已经加上了，下面看一下运行的效果。

调试Index.htm：

打开后，只有模板的内容：

此时，修改地址栏的后缀名，改为Index.ashx，就会显示本文开篇时的效果图了。

（图中点击了a8、b8行末端的“选择”按钮，在下方的input标签中显示"a8"和"b8"）

结语：

这种制作网页的方法是最原生态的，是编程人员必须掌握的。

本文只是介绍一个简单的案例，实际上，在ashx中，可以编写平常我们写的C#代码（包括SQL的操作），在html中也能编写javascript，也能使用css样式，结合form提交和页面的跳转，可以完成大部分的网页功能，本人还没有学会mvc，所以只能介绍这种方法了，欢迎各位交流。

C# ashx与html的联合使用的更多相关文章

  1. Visual Studio 2013 添加一般应用程序(.ashx)文件到SharePoint项目

    默认,在用vs2013开发SharePoint项目时,vs没有提供一般应用程序(.ashx)的项目模板,本文解决此问题. 以管理员身份启动vs2013,创建一个"SharePoint 201 ...

  2. Dynamics CRM 之ADFS 使用 WID 的独立联合服务器

    ADFS 的使用 WID 的独立联合服务器适用于自己的测试环境,常用的就是在虚机中使用. 拓扑图如下: wID:联合身份验证服务配置为使用 Windows 内部数据库

  3. Dynamics CRM 之ADFS 使用 WID 的联合服务器场

    使用 WID 的联合服务器场 默认拓扑 Active Directory 联合身份验证服务 (AD FS) 是联合服务器场,使用 Windows 内部数据库 (WID). 在这种拓扑, AD FS 使 ...

  4. ashx中Response.ContentType的常用类型

    ashx中Response.ContentType的常用类型: text/plaintext/htmltext/xmlapplication/jsonimage/GIFapplication/x-cd ...

  5. Hibernate（5）—— 联合主键 、一对一关联关系映射（xml和注解） 和 领域驱动设计

    俗话说,自己写的代码,6个月后也是别人的代码……复习!复习!复习!涉及的知识点总结如下: One to One 映射关系 一对一单向外键(XML/Annotation) 一对一双向外键关联(XML/A ...

  6. Federated Identity Pattern 联合身份模式

    Delegate authentication to an external identity provider. This pattern can simplify development, min ...

  7. 一种开发模式：ajax + ashx + UserControl

    一.ajax+ashx模式的缺点     在web开发过程中,为了提高网站的用户体验,或多或少都会用到ajax技术,甚至有的网站全部采用ajax来实现,大量使用ajax在增强用户体验的同时会带来一些负 ...

  8. [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合

    [占位-未完成]scikit-learn一般实例之十一:异构数据源的特征联合 Datasets can often contain components of that require differe ...

  9. SQL联合查询：子表任一记录与主表联合查询

    今天有网友群里提了这样一个关于SQL联合查询的需求: 一.有热心网友的方案: 二.我的方案: select * from ( select a.*,(select top 1 Id from B as ...

随机推荐

  1. PAT (Basic Level) 1001害死人不偿命的(3n+1)猜想 (15)

    卡拉兹(Callatz)猜想: 对任何一个自然数n,如果它是偶数,那么把它砍掉一半:如果它是奇数,那么把(3n+1)砍掉一半.这样一直反复砍下去,最后一定在某一步得到n=1.卡拉兹在1950年的世界数 ...

  2. [topcoder]UnsealTheSafe

    http://community.topcoder.com/stat?c=problem_statement&pm=4471&rd=10711 这题果然是道简单题,图+DP.拿道题便觉 ...

  3. not in改写关联无需考虑重复数据

    SQL> select * from a1; ID NAME ---------- ---------- 1 a 1 a 2 a 3 a SQL> select * from a2; ID ...

  4. ftp 匿名访问设置

    为了让ftp可以匿名访问,需要设置/etc/vsftp.conf 的 anonymous_enable=YES. 当然仅仅是这样,还是不可以的,会出现错误: vsftpd: refusing to r ...

  5. 余弦距离、欧氏距离和杰卡德相似性度量的对比分析 by ChaoSimple

      1.余弦距离 余弦距离,也称为余弦相似度,是用向量空间中两个向量夹角的余弦值作为衡量两个个体间差异的大小的度量. 向量,是多维空间中有方向的线段,如果两个向量的方向一致,即夹角接近零,那么这两个向 ...

  6. 【转】Android--多线程之Handler--不错

    原文网址:http://www.cnblogs.com/plokmju/p/android_handler.html 前言 Android的消息传递机制是另外一种形式的“事件处理”,这种机制主要是为了 ...

  7. Windows 8 关闭无线后无法打开WIFI的解决办法

    转:http://blog.sina.com.cn/s/blog_49d02ed101016b4n.html 在使用 Windows 8 的过程中,遇到过几次使用键盘上的功能键(笔者笔记本上的快捷键是 ...

  8. HTMLTestRunner生成空白resault.html

    发现一奇葩问题,用idle或pyscripter执行脚本,生成的是空白html,通过cmd,进入脚本目录执行python xx.py,却能生成测试报告. HTMLTestRunner 例子 #codi ...

  9. 一个awk命令的demo

    /prefix_* | awk -F'\x3' '{print $2}' | awk -F'\x2' '{for(i=0; i<NF; i++)print $i}'> ~/20140819 ...

  10. ERROR: The node /hbase is not in ZooKeeper. It should have been written by the master. Check the value configured in 'zookeeper.znode.parent'. There could be a mismatch with the one configured in the

    hbase  shell下list命令出错. [hadoop@djt002 hbase]$ hbase shell 2016-07-20 19:37:12,522 INFO  [main] Confi ...