当前位置: 移动技术网 > IT编程>开发语言>.net > asp.net点击‘查看更多’实现无刷新加载

asp.net点击‘查看更多’实现无刷新加载

2018年03月05日  | 移动技术网IT编程  | 我要评论

美国黑客,生化奇兵:无限,花街大姐大

页面页面的js代码如下,
01 <b>    <script type="text/javascript">
02         $(function () {
03             function init(count, start) {
04                 $.ajax({
05                     type: "GET",
06                     dataType: "json",
07                     url: "Handler/Handler.ashx",
08                     data: { action: "GetMoreNews", count: count, start: start },
09                     beforeSend: function () { $("#pload").show(); $("#more2").hide(); },
10                     complete: function () { $("#pload").hide(); $("#more2").show(); },
11                     success: function (json) {
12                         var str = "";
13                         $.each(json, function (index, array) {
14                             var str = "<p class='single_item'>"
15                                                 + "<p class='element_head'>"
16                                                     + "<p class='author'>" + array['Title'] +"</p>"
17                                                     + "<p class='date'>" + array['Date'] + "</p>"
18                                                 + "</p>"
19                                             + "<p class='content'>" + array['Contents'] + "</p>"
20                                             + "</p>";
21                             $("#more").append(str);
22                         });
23                         if (json == "") {
24                             $("#more2").html("没有更多内容加载了……");
25                         }
26                     }
27                 });
28             }
29             var count = 5;
30             var start = 0;
31             init(count, start);
32             $(".get_more").click(function () {
33                 start += 5;
34                 init(count, start);
35             });
36         });
37     </script></b>
解释上面js的大体意思:定义一个init方法,此方法带有两个参数count和start,count意思是每次加载显示评论数,start意思是,每次从数据库中读取的位置,比如0,5,10。
Handler.ashx处理页面的代码如下
1 <b>case "GetMoreNews":
2      int count = int.Parse(context.Request.QueryString["count"].ToString());
3      int start = int.Parse(context.Request.QueryString["start"].ToString());
4      IList<WineNews> morenews = WineNewsManager.WineNewsQueryFromMToN(count,start);
5      Content = JavaScriptConvert.SerializeObject(morenews);
6       break;</b>
WineNewsQueryFromMToN代码如下
01 <b>public static IList<WineNews> WineNewsQueryFromMToN(int count,int start)
02     {
03         using (SqlConnection cn = new SqlConnection(SQLHelp.Conn))
04         {
05             cn.Open();
06             string sql = "SELECT TOP " + count + " f.* FROM tb_WineNews f WHERE Id NOT IN (SELECT TOP " + start + " Id FROM tb_WineNews ORDER BY Id desc) ORDER BY Id desc";
07             SqlCommand cmd = new SqlCommand(sql, cn);
08             SqlDataReader dr = cmd.ExecuteReader();
09             IList<WineNews> list = new List<WineNews>();
10             while (dr.Read())
11             {
12                 WineNews wineNews = new WineNews();
13                 if (dr["ID"] != DBNull.Value)
14                 {
15                     wineNews.ID = (int)dr["ID"];
16                 }
17                 if (dr["Title"] != DBNull.Value)
18                 {
19                     wineNews.Title = (string)dr["Title"];
20                 }
21                 if (dr["Contents"] != DBNull.Value)
22                 {
23                     wineNews.Contents = (string)dr["Contents"];
24                 }
25                 if (dr["Picture"] != DBNull.Value)
26                 {
27                     wineNews.Picture = (string)dr["Picture"];
28                 }
29                 if (dr["Date"] != DBNull.Value)
30                 {
31                     wineNews.Date = ((DateTime)dr["Date"]).ToString("yyyy-MM-dd HH:mm:ss");
32                 }
33                 list.Add(wineNews);
34             }
35             dr.Close();
36             return list;
37         }
38     }</b>
运行效果如下
 
 
作者:陈赛

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网