2

c#一次数据库查询,JS实现内容分页

系统 2466 0

一次数据库操作---JS实现内容分页,避免无谓的数据库查询往返操作,仅提供思维供大家参考,缩短大家的学习时间。(当然对于内容过于庞大的数据,呵呵,对于一个内容对象应该不至于很大)
       内容分页aspx文件js代码如下:

JS代码
 1   < script language = " javascript "  type = " text/javascript " >
 2        <!--    
 3       function $(_sId){ return  document.getElementById(_sId)} // the method of get object by id
 4         function setTab(op)
 5       {
 6           var cursel = $( " currentPage " ).innerHTML; // get the current page num
 7           var n = $( " allPage " ).innerHTML; // get all pages num
 8            if (op == " 1 " )
 9           { // add 1 operater
10               if (cursel == n)
11              {     
12                  return ;
13              }         
14           }
15            else
16           { //  subtract 1 operater
17                if (cursel == 1 )
18               {
19                  return ;
20               }        
21           }   
22           cursel = parseInt(cursel) + op; //  set value
23            for (i = 1 ;i <= n;i ++ )
24           { //  foreach the div
25             var con = $( " con_ " + i);
26             con.style.display = i == cursel ? " block " : " none " ; // control the style of the current div
27           }
28           $( " currentPage " ).innerHTML = cursel;   // set the text
29           $( " spCurr " ).innerHTML = cursel;      // set the operated result    
30       }   
31        //  -->
32        </ script >
33   </ head >
34   < body >
35        < form id = " form1 "  runat = " server " >
36        < div >
37        < table width = " 100% "  border = " 0 "  cellspacing = " 0 "  cellpadding = " 0 " >
38                    < tr >
39                       <!--  left  -->
40                        < td valign = " top "  align = " right "  width = " 100 " >                       
41                        </ td >
42                        <!--   body   -->
43                        < td align = " center "  valign = " top "  width = " 920 " >
44                         
45                                < div style = " background:red; width: 100%; height: 30px; " >  
46                                < span > 提供一种JS思维,帮助大家缩短学习的时间,仅供参考 </ span >
47                                </ div >
48                                <!--   content body  -->
49                                < div >
50                                    < div style = " background:blue;width: 100%; height: auto; " >
51                                        < div >
52                                            < span   ><%= contentIssuedate %></ span >
53                                        </ div >
54                                    </ div >
55                                    < div >
56                                    <%= contentBody %>
57                                    </ div >
58                                    < div style = " clear: both; " >
59                                    </ div >
60                                </ div >
61                                <!--  submit  page  change -->
62                                < div style = " background:blue; width: 100%; height: 30px; margin-bottom: 0px; " >
63                                   < table >
64                                   < tr >
65                                   < td  >< div  id = " leftSub "  align = " left "   onclick = " setTab(-1) "   >< a href = " # " > 上一页 </ a >   </ div >     </ td >
66                                   < td  >< div  align = " center "   > 第  < span id = " spCurr " ><%= currentPage %></ span >  页 共  <%= allPage %>  页 </ div >   </ td >
67                                   < td  >< div id = " rightAdd "   align = " right "  onclick = " setTab(1) "   >< a href = " # " >  下一页 </ a >   </ div ></ td >
68                                   </ tr >
69                                   </ table >     
70                                </ div >
71                                < div style = " clear: both; " >          
72                            </ div >  
73                        </ td >
74                        <!--   right  -->
75                        < td valign = " top "  align = " left "  width = " 60 " >                         
76                        </ td >
77                    </ tr >
78                </ table >
79        </ div >
80        </ form >
81   </ body >
82   </ html >
83  

 

  相应的C# cs文件,先引用using System.Text;其中的stringbuilder相对于string性能更好!

    

CS代码
 1   protected   string  contentBody;    
 2        protected   string  contentIssuedate;  
 3        protected   string  currentPage;
 4        protected   string  allPage;   
 5      
 6        protected   void  Page_Load( object  sender, EventArgs e)
 7       {
 8           BindContent(); // 提取内容
 9       }
10        private   void  BindContent()
11       {
12            this .contentIssuedate  =  DateTime.Now.ToString();
13            //  用简单的数组代替正则表达式来进行相应的内容分组
14            string [] pages  =   new   string [ 5 ] {  " 第<br>一<br>页<br>的<br>内<br>容 " " 第<br>二<br>页<br>的<br>内<br>容 " " 第<br>三<br>页<br>的<br>内<br>容 " " 第<br>四<br>页<br>的<br>内<br>容 " " 第<br>五<br>页<br>的<br>内<br>容 "  };
15            this .allPage  =  pages.Length.ToString();
16            this .currentPage  = " 1 " ;
17           StringBuilder sb  =   new  StringBuilder();
18            // 设置所有的内容 进行JS的操作    display:none隐藏内容----
19           sb.Append( " <div id='currentPage' style='display: none;'>1</div> " );
20           sb.Append( " <div id='allPage' style='display: none;'> "   +  pages.Length  +   " </div> " );
21            for  ( int  i  =   0 ; i  <  pages.Length; i ++ )
22           {
23                int  temp  =  i  +   1 ;
24                if  (i  ==   0 )
25               {
26                   sb.Append( " <div  id='con_ "   +  temp  +   " '> " );
27                   sb.Append(pages[i].ToString());
28                   sb.Append( " </div> " );
29               }
30                else
31               {
32                   sb.Append( " <div  id='con_ "   +  temp  +   " ' style='display: none;'> " );
33                   sb.Append(pages[i].ToString());
34                   sb.Append( " </div> " );
35               }
36           }
37            this .contentBody  =  sb.ToString();
38       }
39  

 

  很简单的操作,仅供参考,运用也很简单的。asp.net fans群的兄弟,不好意思,没时间写这个,学习时间比较紧。XX,深更半夜写的,哈哈 http://www.cnblogs.com/jasenkin/archive/2009/12/18/1626838.html .

c#一次数据库查询,JS实现内容分页


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论