jquery paging 부분용

## CSS

<style>
.paging{text-align:center;margin:2px;padding:2px; }
.paging span{cursor:pointer; margin:2px;padding:2px;border-radius: 2px;}
.paging span.current, #paging span:hover{background-color:#369;color:#fff}
</style>

## JAVASCRIPT

<script>
//-- 페이징 관련
function showPaging(page,totalPage){
page = parseInt(page);
totalPage = parseInt(totalPage);
var paging = $('#paging');
paging.html("");
var defSpan = $(document.createElement('span'));
var limit = 10;
var st = Math.floor((page-1)/limit)*(limit)+1;
var ed = Math.min(st+limit-1,totalPage);
var spans = [];
if(totalPage<=0){
paging.html("NoPage");
return;
}


var span = defSpan.clone();
span.prop('page',1);
span.text('처음');
spans.push(span);

var span = defSpan.clone();
span.prop('page',(st-1)<=0?-1:(st-1));
span.text('이전');
spans.push(span);

for(var i=st,m=ed;i<=m;i++){
var span = defSpan.clone();
span.prop('page',i);
if(i == page){
span.addClass('current');
}
span.text(i);
spans.push(span);
}

var span = defSpan.clone();
span.prop('page',(ed+1)>=totalPage?-1:(ed+1));
span.text('다음');
spans.push(span);

var span = defSpan.clone();
span.prop('page',totalPage);
span.text('마지막');
spans.push(span);
for(var i=0,m=spans.length;i<m;i++){
paging.append(spans[i]);
}

}
function submitPaging(n){
if(!selectedShForm){return false;}
selectedShForm.page.value = n;
if(selectedShForm.onsubmit()){
selectedShForm.submit();
}
}
function clickPaging(event,paging){
event = $(event)[0];
if(event.target && event.target.tagName =='SPAN' && event.target.page && event.target.page>0){
submitPaging(event.target.page)

}
return false;
}
$(function(){
// $('#paging').click( function(event){clickPaging(event,this)} );
showPaging(1,0)
})
</script>


## HTML

<div id="paging" class="paging" onclick="clickPaging(event)"><span >-</span></div>




## 결과

처음이전2122232425262728다음마지막




만드는것도 일이다..
나중에 복사해서 써야지.

showPaging(1,0) 두번째에 0이하의 값을 넣으면 NoPage 라고 나옴.


댓글
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
제목 작성자 날짜
공대여자
공대여자
mins01
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자
공대여자