안녕하세요..
가끔 페이징에 다른 페이지에 이동을 하려고 해도
예) 11페이지로 이동을 할려면, 10페이지 먼저 클릭 후 다음페이지로 클릭해야 이동...
이런 경우가 있어서 약간의 팁으로 수정을 해 보았습니다.
1. 먼저 common.lib.php 를 약간 수정 합니다.
한글 표시는 전부 feather-icon으로 대체 하였습니다.
[code]
// 한페이지에 보여줄 행, 현재페이지, 총페이지수, URL
function get_paging($write_pages, $cur_page, $total_page, $url, $add="")
{
$url = preg_replace('#(&)?page=[0-9]*#', '', $url);
$url .= substr($url, -1) === '?' ? 'page=' : '&page=';
$str = '';
if ($cur_page > 1) {
$str .= '<a href="'.$url.'1'.$add.'" class="pg_page pg_start" title="Go to 1"><i data-feather="chevrons-left"></i></a>'.PHP_EOL;
}
$start_page = ( ( (int)( ($cur_page - 1 ) / $write_pages ) ) * $write_pages ) + 1;
$end_page = $start_page + $write_pages - 1;
if ($end_page >= $total_page) $end_page = $total_page;
if ($cur_page > 1) $str .= '<a href="'.$url.($cur_page-1).$add.'" class="pg_page pg_prev" title="Go to '.($cur_page-1).'"><i data-feather="chevron-left"></i></a>'.PHP_EOL;
if ($total_page > 1) {
for ($k=$start_page;$k<=$end_page;$k++) {
if ($cur_page != $k)
$str .= '<a href="'.$url.$k.$add.'" class="pg_page">'.$k.'<span class="sound_only">Page</span></a>'.PHP_EOL;
else
$str .= '<span class="sound_only">열린</span><strong class="pg_current">'.$k.'</strong><span class="sound_only">Page</span>'.PHP_EOL;
}
}
if ($cur_page < $total_page) $str .= '<a href="'.$url.($cur_page+1).$add.'" class="pg_page pg_next" title="Go to '.($cur_page+1).'"><i data-feather="chevron-right"></i></a>'.PHP_EOL;
if ($cur_page < $total_page) {
$str .= '<a href="'.$url.$total_page.$add.'" class="pg_page pg_end" title="Go to '.$total_page.'"><i data-feather="chevrons-right"></i></a>'.PHP_EOL;
}
if ($total_page > 10) { //2022-08-29 추가
if ($k >= $total_page) $k = $total_page;
$str .= ' GO ';
$str .= '<input type="text" id="goinput" class="pg_page" style="width: 40px;background:white;" value="'.$k.'" >';
$str .= '<a href="'.$url.$k.'" id="gotopg" class="pg_page"><i data-feather="skip-forward"></i></a>'.PHP_EOL;
}
if ($str)
return "<nav class=\"pg_wrap\"><span class=\"pg\">{$str}</span></nav>";
else
return "";
}
[/code]
2. 해당 list.skin.php 에서
만약 feather.js가 없으시면
<script src="<?php echo $board_skin_url ?>/feather.js"></script>
하시고,js파일을 다운로드 후 저장하시면 됩니다.
[code]
<!-- 페이지 -->
<?php echo $write_pages; ?>
<script>
feather.replace(); //feather 아이콘 사용
$(function(){
$(document).tooltip(); //페이징 처음,마지막에서 툴팁
});
</script>
<script>
$(function(){
$('#goinput').change(function(){ // 입력(페이지) 변할 때
var page = $(this).val(); //입력 받은 페이지
var href = $('#gotopg').attr('href'); //링크의 이전 주소
var goto = href.replace(/&page=[0-9]*/gi,'&page=') + page; // 이동페이지의 값을 입력 받은 페이지로 변경
//console.log(page,href,goto)
$('#gotopg').attr('href',goto); // a 클릭시 이동후 초기값 변경 : 마지막페이지 + 1
})
});
</script>
[/code]
=>완성된 페이징은 그림처럼 되어집니다.
댓글 12개
제가 jquery 내용을 잘 몰라서~한참을 헤맸어요~
그누 구버전 이라서 그런지 어디서 연관된지는 모르겠지만 엔터를 치면 페이지이동은 안되지만 삭제할거냐는 문구가 뜨면서 삭제쪽이랑 연관이 되는 현상이 있어서
엔터를 지정해주려고 event.keyCode=='13' 로 엔터감지를 해보는데도 잘 안먹히더라구요
그래서
$('input[type="text"]').keydown(function() {
if (event.keyCode === 13) {
event.preventDefault();
};
});
값으로 엔터를 아에 막아놨는데..혹시나 저처럼 왕초보가 저같은 일을 겪게된다면
엔터를 막아놓는게 더 나을거 같다라는....
미터강님 조언 캄사합니다~~ 그리고 만드신 팁도 아주 자랑스럽게 잘 사용하겠습니다
게시글 목록
| 번호 | 제목 |
|---|---|
| 24318 | |
| 24317 | |
| 24315 | |
| 24309 | |
| 24294 | |
| 24293 | |
| 24277 | |
| 24262 | |
| 24260 | |
| 24253 | |
| 24251 | |
| 24236 | |
| 24233 | |
| 24228 | |
| 24226 | |
| 24221 | |
| 24214 | |
| 24203 | |
| 24201 | |
| 24199 | |
| 24196 | |
| 24195 | |
| 24194 | |
| 24192 | |
| 24191 | |
| 24187 | |
| 24185 | |
| 24183 | |
| 24172 | |
| 24168 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기