C\#페이지 구성 요 소 를 실현 하 는 방법

5598 단어 C#페이지 구성 요소페이지 를 나누다
페이지 는 전단 과 백 엔 드 를 막론하고 기본적으로 광범 위 하 게 응용 된다!다음은 작은 사례 를 통 해 이 페이지 효 과 를 완성 합 니 다.
매개 변수 의미:
string url Format:서버 측 에 전달 할 URL 주소 형식 으로 하이퍼링크 를 눌 렀 을 때 해당 하 는 점프 를 할 수 있 습 니 다.
long totalSize:     총 데이터 항목 수.
long pageSize:    페이지 당 몇 개의 데이터
 long currentPage:현재 페이지 수
그 다음 에 구체 적 인 사례 를 통 해 이 페이지 를 나 누 는 방법 을 사용한다.
1.페이지 나 누 는 방법:

/// <summary>
  ///      html
  /// </summary>
  /// <param name="urlFormat">      。list.ashx?pagenum={pageNum}。    {pagenum}          </param></param>
  /// <param name="totalSize">     </param>
  /// <param name="pageSize">       </param>
  /// <param name="currentPage">   </param>
  /// <returns></returns>
  public static RawString Pager(string urlFormat, long totalSize,
   long pageSize, long currentPage)
  {
   StringBuilder sb = new StringBuilder();
   //   
   long totalPageCount = (long)Math.Ceiling((totalSize * 1.0f) / (pageSize * 1.0f));
   //       
   long firstPage = Math.Max(currentPage - 5, 1);
   //       
   long lastPage = Math.Min(currentPage + 6, totalPageCount);
   //    ,  
   sb.AppendLine("<div><a href='" + urlFormat.Replace("{pageNum}", "1") + "'>  </a>");
   //          
   for (long i = firstPage; i < lastPage; i++)
   {
    string url = urlFormat.Replace("{pageNum}", i.ToString());
    if (i == currentPage) //          
    {
     sb.AppendLine("<a>" + i + "</a>");
    }
    else
    {
     sb.AppendLine("<a href='" + url + "'>" + i + "</a>");
    }
   }
   //      
   sb.AppendLine("<a href='" + urlFormat.Replace("{pageNum}", totalPageCount.ToString()) + "'>  </a></div>");
   return new RawString(sb.ToString());
  }
2.사례 호출:
서버 쪽(test.ashx):효 과 를 쉽게 보기 위해 데 이 터 를 직접 사용 하 는 고정 데 이 터 를 보 여 줍 니 다.

public void ProcessRequest(HttpContext context)
  {
   context.Response.ContentType = "text/html";
   long pn = Convert.ToInt64(context.Request["pn"]);
   if (pn == 0) //Convert.ToInt64(null)    0
   {
    pn = 1;
   }
   long[] num = new long[50]; //            
   for (int i = 0; i < 50; i++)
   {
    num[i] = ((pn-1) * 50) + i;
   }
   OutputRazor(context, "~/test.cshtml", new { nums=num,page=pn}); //    Razor    
  }
이곳 의 Razor 방법 은 다음 과 같다Razor 템 플 릿 엔진 소개
UI 엔 드 디 스 플레이(test.cshtml):

<body> 
  <ul>
    @{
  foreach (int i in Model.nums)
  {
   <li>@i</li>
  }
  }
   </ul>
  @Pager("test.ashx?pn={pageNum}", 1020, 50, Model.page); 
</body>
효과 그림:

3.jQuery 페이지 플러그 인:
앞에서 쓴 것들 은 주로 기능 의 실현 을 진행 하 는데 스타일 효과 가 좀 떨어진다.jQuery 를 통한 페이지 효과
jQuery 의 효과 도 및 호출 방법:

 전체 코드:

<!DOCTYPE html>
<html lang="zh-cn" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>       jQuery    </title>
<style>
*{ margin:0; padding:0; list-style:none;}
a{ text-decoration:none;}
a:hover{ text-decoration:none;}
.tcdPageCode{padding: 15px 20px;text-align: left;color: #ccc;}
.tcdPageCode a{display: inline-block;color: #428bca;display: inline-block;height: 25px; line-height: 25px; padding: 0 10px;border: 1px solid #ddd; margin: 0 2px;border-radius: 4px;vertical-align: middle;}
.tcdPageCode a:hover{text-decoration: none;border: 1px solid #428bca;}
.tcdPageCode span.current{display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px;color: #fff;background-color: #428bca; border: 1px solid #428bca;border-radius: 4px;vertical-align: middle;}
.tcdPageCode span.disabled{ display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px; color: #bfbfbf;background: #f2f2f2;border: 1px solid #bfbfbf;border-radius: 4px;vertical-align: middle;}
</style>
</head>
<body>
<!--     begin -->
 <div class="tcdPageCode">
 </div>
 <pre>
     ：
 $(".tcdPageCode").createPage({
  pageCount:20,
  current:1,
  backFn:function(p){
   //      ，p     
  }
 });
 pageCount：   
 current：   
 </pre>
</body>
<script src="/ajaxjs/jquery.min.js"></script>
<script src="/ajaxjs/jquery.page.js"></script>
<script>
 $(".tcdPageCode").createPage({
  pageCount:20,
  current:5,
  backFn:function(p){
   console.log(p);
  }
 });
</script>
<!--     end -->
</html>
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.
자바 문자열,list 를 파일 에 기록 하고 내용 을 읽 는 사례
자바 ftp 에서 TXT 파일 읽 기 사례

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage