2014-07-10 4 views
0

자바 스크립트 :내 콜백의이 코드가 페이지로드시 실행되는 이유는 무엇입니까?

$('#pagination-demo').twbsPagination({ 
    totalPages: 35, 
    visiblePages: 7, 
    onPageClick: function (event, page) { 
     console.log('Why does this run on load?'); 
    } 
}); 

마크 업 : 여기

<!DOCTYPE html> 
<html> 

<head> 
    <script src="http://code.jquery.com/jquery.min.js"></script> 
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 

    <script src="http://esimakin.github.io/twbs-pagination/js/jquery.twbsPagination.js"></script> 
    <meta charset="utf-8"> 
    <title>JS Bin</title> 
</head> 

<body> 
    <ul id="pagination-demo" class="pagination-sm"></ul> 
</body> 

</html> 

JS 빈 : "부하에이 실행을하지 왜"나는 콘솔에 로그인 onPageClick 콜백에서

http://jsbin.com/potekina/1/edit 그 코드가 링크에서 클릭했을 때만 발생해야하는 경우 왜로드에서 실행되는지 이해가 안됩니다. 로드시 왜 실행됩니까? the source에서

+0

JSBin은 보완책이지만 위의 모든 관련 코드도 여기에 추가하십시오. JSBin이 미래에 존재하지 않을 경우를 대비하여 – CodingIntrigue

답변

4

:

init: function (options) { 
    ... 
    this.$element.bind('page', this.options.onPageClick); 
    ... 
    this.$element.trigger('page', this.options.startPage); 
} 

twpsPagination 플러그인은 분명히 초기화에 onPageClick을 유발한다. 이는 플러그인의 특질이지 코드의 이상은 아닙니다. 우리는 디자인 선택이 무엇인지 저자의 추론에 답할 수는 없습니다.

아마도이 이벤트는 게시 페이지 렌더링 설정을위한 이벤트였으며 이후 페이지로드시 초기 페이지를 설정하는 것과 관련이 있다고 추측했지만 "페이지 클릭" 그때 약간의 잘못된 이름입니다.

var firstPageClick = true; 

onPageClick: function() { 
    if(firstPageClick) { 
     firstPageClick = false; 
     return; 
    } 

    // actual event listener 
} 
+0

감사합니다. 여기에 자바 스크립트에 대한 나의 전체적인 이해가 다시 근본적으로 잘못되었다고 생각했다. – Rigil

8

초기화에 추가 할 수있는 옵션이 있습니다 :

당신이 정말로 스크립트가 실제 페이지 클릭에서만 실행하도록하려는 경우, 당신은 같은 변수로, 몇 가지 해결 방법을 수행해야 할 것

$('.pagination').twbsPagination({ 
    initiateStartPageClick: false 
}); 
관련 문제