asp.net项目进度1:html+ashx+ajax实习动态绑定
如意编程网
收集整理的这篇文章主要介绍了
asp.net项目进度1:html+ashx+ajax实习动态绑定
小编觉得挺不错的,现在分享给大家,帮大家做个参考.
近日学习之余,闲来无事;
受上天启发(哈哈)突然想做一个人博客;
业余之时,想把一些特色代码贴于园内;边做边贴。
希望大家根据代码能给予指教;
(注:本人为一块要毕业学生。经验有限 ,代码定有不足及漏洞之处。望大家不吝赐教;)
博客首页思路:
首页即为门面,所以定要将其做的***。
原本想法只是想以平常方法实现。后来。浏览各大型网站,发现大多网站多以页面静态化。
随即想到静态页面的好处。奈何。本人首页想要时常更新;
2 <div id="left" class="leftclass">
3 <ul>
4 <li>
5 <div>
6 <h2>文章搜索</h2>
7 <input type="text" name="s" id="s" size="15" value="" />
8 </div>
9 </li>
10 <li>
11
12 <h2>排行榜</h2>
13 <ul id="category">
14
15 </ul>
16
17 </li>
18
19
20 </ul>
21 </div>
2 $(document).ready(function () {
3
4 init();
5
6 })
7 function init() {
8 $.post('/ashx/index_ashx.ashx', { name: "1" }, function (data) {
9 show(data);
10 }
11 );
12 }
13 function show(data) {
14 var json = eval(data);
15 //把数据转化为数组。此语句运用eval计算某个字符串,并执行其中的的 JavaScript 代码 的特性;
16 //将后台传来的如[{"type":"a","type":"b"}]数据转化为数组
17 //其中运用{}声明对象,将数组的每一个元素都声明为对象。然后遍历读取属性
18 for (var number in json) {
19 if (json[number].type == "0") {
20 $("#category").append('<li >25 }
//将后台传来的如[{"type":"a","type":"b"}]数据转化为数组
//其中运用{}声明对象,将数组的每一个元素都声明为对象。然后遍历读取属性
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Text;
6 namespace blog.wep.ashx
7 {
8 /// <summary>
9 /// index_ashx 的摘要说明
10 /// </summary>
11 public class index_ashx : IHttpHandler
12 {
13 StringBuilder jsonBuilder = new StringBuilder();// 声明拼接字符串
14 public void ProcessRequest(HttpContext context)
15 {
16 context.Response.ContentType = "text/plain";//设置类型
17 jsonBuilder.Append("[");
18 if (context.Request["name"] == "1")
19 {
20 bind();
21 }
22 context.Response.Write(jsonBuilder);
23 }
24 void bind()
25 {
26 blog.BLL.category_t category = new BLL.category_t();
27 List<blog.model.category_t> allCategory=category.GetAllModel(System.Data.CommandType.StoredProcedure, "category_staff", null);
28 foreach (blog.model.category_t cate in allCategory)
29 {
30 jsonBuilder.Append("{\"categoryid\":" + "\"" + cate.categoryid + "\",");
31 jsonBuilder.Append("\"type\":" + "\"0\",");
32 jsonBuilder.Append("\"category_r\":" + "\"" + cate.category_r + "\"},");
33
34 }
35 jsonBuilder.Append("{\"type\":" + "\"1\"}");
36 jsonBuilder.Append("]");
37 }
38 public bool IsReusable
39 {
40 get
41 {
42 return false;
43 }
44 }
45 }
46 }
想到有前辈以ajax方式做过相似功能
现将实现详细代码贴下。望大家给予改进html 代码
1 <div id="bodycontent" class="clearfix">
2 <div id="left" class="leftclass">
3 <ul>
4 <li>
5 <div>
6 <h2>文章搜索</h2>
7 <input type="text" name="s" id="s" size="15" value="" />
8 </div>
9 </li>
10 <li>
11
12 <h2>排行榜</h2>
13 <ul id="category">
14
15 </ul>
16
17 </li>
18
19
20 </ul>
21 </div>
js代码
2 $(document).ready(function () {
3
4 init();
5
6 })
7 function init() {
8 $.post('/ashx/index_ashx.ashx', { name: "1" }, function (data) {
9 show(data);
10 }
11 );
12 }
13 function show(data) {
14 var json = eval(data);
15 //把数据转化为数组。此语句运用eval计算某个字符串,并执行其中的的 JavaScript 代码 的特性;
16 //将后台传来的如[{"type":"a","type":"b"}]数据转化为数组
17 //其中运用{}声明对象,将数组的每一个元素都声明为对象。然后遍历读取属性
18 for (var number in json) {
19 if (json[number].type == "0") {
20 $("#category").append('<li >25 }
具体思路便是
//将后台传来的如[{"type":"a","type":"b"}]数据转化为数组
//其中运用{}声明对象,将数组的每一个元素都声明为对象。然后遍历读取属性
ashx代码
1 using System;
2 using System.Collections.Generic;
3 using System.Linq;
4 using System.Web;
5 using System.Text;
6 namespace blog.wep.ashx
7 {
8 /// <summary>
9 /// index_ashx 的摘要说明
10 /// </summary>
11 public class index_ashx : IHttpHandler
12 {
13 StringBuilder jsonBuilder = new StringBuilder();// 声明拼接字符串
14 public void ProcessRequest(HttpContext context)
15 {
16 context.Response.ContentType = "text/plain";//设置类型
17 jsonBuilder.Append("[");
18 if (context.Request["name"] == "1")
19 {
20 bind();
21 }
22 context.Response.Write(jsonBuilder);
23 }
24 void bind()
25 {
26 blog.BLL.category_t category = new BLL.category_t();
27 List<blog.model.category_t> allCategory=category.GetAllModel(System.Data.CommandType.StoredProcedure, "category_staff", null);
28 foreach (blog.model.category_t cate in allCategory)
29 {
30 jsonBuilder.Append("{\"categoryid\":" + "\"" + cate.categoryid + "\",");
31 jsonBuilder.Append("\"type\":" + "\"0\",");
32 jsonBuilder.Append("\"category_r\":" + "\"" + cate.category_r + "\"},");
33
34 }
35 jsonBuilder.Append("{\"type\":" + "\"1\"}");
36 jsonBuilder.Append("]");
37 }
38 public bool IsReusable
39 {
40 get
41 {
42 return false;
43 }
44 }
45 }
46 }
具体代码便是这些。这些原理都有前辈做过。
本人所写如有不足之处忘指教;
总结
以上是如意编程网为你收集整理的asp.net项目进度1:html+ashx+ajax实习动态绑定的全部内容,希望文章能够帮你解决所遇到的问题。
- 上一篇: 正则表达式匹配html标签里面的内容
- 下一篇: HTML5自定义属性之data-*