https://sir.kr/g5_tip/19034?page=10
위 sir에서부터 시작해봤던건데 구글하면서 이것저것 짜집기하면서 해보면서
코어를 안건드리고 해보려고 시도해봤어요
수정이나 조언해주실게 있다면 해주시면 감사하겠어요
우선 취지는 제 경우는 자료실에 자료가 500페이지가 넘어가는데 검색으로 못찾고
버튼으로 뒤로 하염없이 가면서 긴가민가 찾는분들때문에
숫자로 원하는 페이지로 점프 시키려고 한거라
특수목적이다보니, 대다수분들은 필요가 없을거라 생각듭니다
최종적으로 하게되면 아래 그림처럼, 페이지네이션 아래 이동버튼과 숫자입력칸이 나오게되요
게시판 보드에서
제일 밖에 있는 list.skin.php 에서 수정을 합니다
스타일은 따로 잡아넣으셔도 되고
상단에
.page-input-container {
margin-top: 10px;
text-align: center;
}
.page-input-container .serach-intext {
display: inline-block;
background-color: #eee;
width: 40px;
height: 32px;
line-height: 32px;
text-align: center;
font-size: 13px;
border-style: none;
border: 1px solid #ddd;
}
.page-input-container .serach-intext-btn {
display: inline-block;
padding: 6px 8px;
line-height: 1.42857143;
background-color: #fff;
border: 1px solid #ddd;
width: auto;
min-width: 32px;
max-width: max-content;
height: 32px;
font-size: 12px;
margin-left: 3px;
}
요렇게 대충 제가 만든스타일을 상단에 배치시킨후
이렇게 기존에, 이전검색 그리고 다음검색 있는 아래 부분에 ( 보드마다 다를수도 있는데 대충 이전검색 다음검색 다음부분 )
===================================================
이 아래부분을 넣어주세요
$(function () {
function goToPage(page) {
var baseUrl = $('#gotopg').data('url'); // 데이터 속성에서 기본 URL을 가져옵니다.
var safePage = parseInt(page, 10);
if (isNaN(safePage) || safePage < 1) {
alert('유효한 페이지 번호를 입력해주세요.');
return; // 유효하지 않은 입력에 대한 처리
}
var newUrl = baseUrl + safePage; // 새 URL 생성
window.location.href = newUrl; // 생성된 URL로 이동
}
$('#goinput').change(function() {
var page = $(this).val();
goToPage(page);
});
$('#goinput').keypress(function(event) {
if (event.keyCode === 13) { // Enter 키 처리
event.preventDefault(); // 기본 동작 방지
var page = $(this).val();
goToPage(page);
}
});
$('#gotopg').click(function(event) {
event.preventDefault(); // 버튼의 기본 동작 방지
var page = $('#goinput').val();
goToPage(page);
});
});
이걸 넣어주시면 끝나요
최대한 XSS 생각해보면서 해봤는데 이렇게 하는게 맞는지는 모르겠어요
일딴 작동은 잘되는거 같은데
테스트로 해보실분 계시다면 기존파일 잘 보관하시면서 한번 해보셔도 될듯 해요