@@ -29,16 +29,16 @@ javascript
29
29
30
30
; ( function ( $ ) {
31
31
32
- // Define Constants
33
- var CLASS_NUM = "page-num" ,
34
- CLASS_PREV = "page-prev" ,
35
- CLASS_NEXT = "page-next" ;
32
+ // Define Constants
33
+ var CLASS_NUM = "page-num" ,
34
+ CLASS_PREV = "page-prev" ,
35
+ CLASS_NEXT = "page-next" ;
36
36
37
37
/**
38
- * Entry
39
- * @param {[type] } options [description]
40
- * @return {[type] } [description]
41
- */
38
+ * Entry
39
+ * @param {[type] } options [description]
40
+ * @return {[type] } [description]
41
+ */
42
42
var Pagination = function ( $el , options ) {
43
43
this . $el = $el ;
44
44
this . options = $ . extend ( { } , $ . fn . pagination . defaults , options ) ;
@@ -56,28 +56,28 @@ javascript
56
56
opts = this . options ;
57
57
$el . on ( "click" , function ( e ) {
58
58
59
- var $target = $ ( e . target ) ,
60
- currentPage = $el . data ( "page" ) ;
59
+ var $target = $ ( e . target ) ,
60
+ currentPage = $el . data ( "page" ) ;
61
61
62
- // number
63
- if ( $target . hasClass ( CLASS_NUM ) ) {
64
- clickHandler ( currentPage , $target . html ( ) ) ;
65
- }
62
+ // number
63
+ if ( $target . hasClass ( CLASS_NUM ) ) {
64
+ clickHandler ( currentPage , $target . html ( ) ) ;
65
+ }
66
66
67
- // prev
68
- else if ( $target . hasClass ( CLASS_PREV ) ) {
69
- if ( currentPage > 1 )
70
- clickHandler ( currentPage , parseInt ( currentPage ) - 1 ) ;
71
- }
67
+ // prev
68
+ else if ( $target . hasClass ( CLASS_PREV ) ) {
69
+ if ( currentPage > 1 )
70
+ clickHandler ( currentPage , parseInt ( currentPage ) - 1 ) ;
71
+ }
72
72
73
- // next
74
- else if ( $target . hasClass ( CLASS_NEXT ) ) {
75
- if ( currentPage < opts . count )
76
- clickHandler ( currentPage , parseInt ( currentPage ) + 1 ) ;
77
- }
73
+ // next
74
+ else if ( $target . hasClass ( CLASS_NEXT ) ) {
75
+ if ( currentPage < opts . count )
76
+ clickHandler ( currentPage , parseInt ( currentPage ) + 1 ) ;
77
+ }
78
78
79
- return false ;
80
- } ) ;
79
+ return false ;
80
+ } ) ;
81
81
} ,
82
82
render : function ( opts ) {
83
83
var opts = $ . extend ( this . options , opts ) ;
@@ -86,125 +86,125 @@ javascript
86
86
setActive ( this . $el ) ;
87
87
}
88
88
} ;
89
-
90
-
91
- /**
92
- * 构建HTML
93
- * @param {object } opts [description]
94
- * @return {string } [description]
95
- */
96
- function buildHTML ( $el , opts ) {
97
- // total page less than 1, don't show pagination.
98
- if ( opts . count <= 1 ) return "" ;
99
-
100
- // build item list
101
- var itemList = [ ] ,
102
- page = parseInt ( $el . data ( "page" ) ) ,
103
- num = Math . min ( opts . num , opts . count ) ,
104
- region = pageRegion ( page , num , opts . count ) ;
105
-
106
- itemList . push ( buildItem ( CLASS_PREV , opts . title . prev ) ) ;
107
- for ( var i = region . start ; i <= region . end ; i ++ ) {
108
- itemList . push ( buildItem ( CLASS_NUM , i ) ) ;
109
- }
110
- itemList . push ( buildItem ( CLASS_NEXT , opts . title . next ) ) ;
111
-
112
- // build body
113
- var result =
114
- Template . body
115
- . replace ( "${className}" , opts . className )
116
- . replace ( "${itemList}" , itemList . join ( "" ) ) ;
117
-
118
- return result ;
119
- }
120
-
121
- function clickHandler ( currentPage , newPage ) {
89
+
90
+
91
+ /**
92
+ * 构建HTML
93
+ * @param {object } opts [description]
94
+ * @return {string } [description]
95
+ */
96
+ function buildHTML ( $el , opts ) {
97
+ // total page less than 1, don't show pagination.
98
+ if ( opts . count <= 1 ) return "" ;
99
+
100
+ // build item list
101
+ var itemList = [ ] ,
102
+ page = parseInt ( $el . data ( "page" ) ) ,
103
+ num = Math . min ( opts . num , opts . count ) ,
104
+ region = pageRegion ( page , num , opts . count ) ;
105
+
106
+ itemList . push ( buildItem ( CLASS_PREV , opts . title . prev ) ) ;
107
+ for ( var i = region . start ; i <= region . end ; i ++ ) {
108
+ itemList . push ( buildItem ( CLASS_NUM , i ) ) ;
109
+ }
110
+ itemList . push ( buildItem ( CLASS_NEXT , opts . title . next ) ) ;
111
+
112
+ // build body
113
+ var result =
114
+ Template . body
115
+ . replace ( "${className}" , opts . className )
116
+ . replace ( "${itemList}" , itemList . join ( "" ) ) ;
117
+
118
+ return result ;
119
+ }
120
+
121
+ function clickHandler ( currentPage , newPage ) {
122
122
var pagination = $ ( document ) . data ( "pagination" ) ;
123
- $el = pagination . $el ,
124
- opts = pagination . options ;
123
+ $el = pagination . $el ,
124
+ opts = pagination . options ;
125
125
$el . data ( "page" , newPage ) ;
126
- if ( ! opts . refresh ) {
127
- pagination . render ( ) ;
128
- }
129
- opts . callback && opts . callback . call ( null , currentPage , newPage ) ;
126
+ if ( ! opts . refresh ) {
127
+ pagination . render ( ) ;
128
+ }
129
+ opts . callback && opts . callback . call ( null , currentPage , newPage ) ;
130
+ }
131
+
132
+ /**
133
+ * 构建单个元素
134
+ * @param {string } clazz 样式名
135
+ * @param {string } text 分页标签显示的内容
136
+ * @return {string } innerHTML
137
+ */
138
+ function buildItem ( clazz , text ) {
139
+ var result =
140
+ Template . item
141
+ . replace ( "${className}" , clazz )
142
+ . replace ( / \$ { text} / g, text ) ;
143
+
144
+ return result ;
145
+ }
146
+
147
+ /**
148
+ * 计算页码区间
149
+ * @param {number } page 当前页码
150
+ * @param {number } num 页码显示的个数
151
+ * @param {number } count 总页码数
152
+ * @return {[type] } [description]
153
+ */
154
+ function pageRegion ( page , num , count ) {
155
+ var boundary = Math . ceil ( num / 2 ) ,
156
+ region ;
157
+ if ( page <= boundary ) {
158
+ region = {
159
+ start : 1 ,
160
+ end : num
161
+ } ;
162
+
163
+ } else {
164
+ var left = boundary ,
165
+ right = num - left ;
166
+
167
+ if ( page + right >= count ) {
168
+ region = {
169
+ start : count - num + 1 ,
170
+ end : count
171
+ }
172
+ } else {
173
+ region = {
174
+ start : page - left + 1 ,
175
+ end : page + right
176
+ }
177
+ }
178
+ }
179
+ return region ;
130
180
}
131
181
132
- /**
133
- * 构建单个元素
134
- * @param {string } clazz 样式名
135
- * @param {string } text 分页标签显示的内容
136
- * @return {string } innerHTML
137
- */
138
- function buildItem ( clazz , text ) {
139
- var result =
140
- Template . item
141
- . replace ( "${className}" , clazz )
142
- . replace ( / \$ { text} / g, text ) ;
143
-
144
- return result ;
145
- }
146
-
147
- /**
148
- * 计算页码区间
149
- * @param {number } page 当前页码
150
- * @param {number } num 页码显示的个数
151
- * @param {number } count 总页码数
152
- * @return {[type] } [description]
153
- */
154
- function pageRegion ( page , num , count ) {
155
- var boundary = Math . ceil ( num / 2 ) ,
156
- region ;
157
- if ( page <= boundary ) {
158
- region = {
159
- start : 1 ,
160
- end : num
161
- } ;
162
-
163
- } else {
164
- var left = boundary ,
165
- right = num - left ;
166
-
167
- if ( page + right >= count ) {
168
- region = {
169
- start : count - num + 1 ,
170
- end : count
171
- }
172
- } else {
173
- region = {
174
- start : page - left + 1 ,
175
- end : page + right
176
- }
177
- }
178
- }
179
- return region ;
180
- }
181
-
182
- /**
183
- * 设置当前激活的页码
184
- * @param {[type] } argument [description]
185
- */
186
- function setActive ( $el ) {
187
- var page = $el . data ( "page" ) ;
188
- $ ( ".pagination > ul > li" , $el ) . removeClass ( "active" ) ;
189
- $ ( "." + CLASS_NUM + "[idx=" + page + "]" , $el ) . parent ( ) . addClass ( "active" ) ;
190
- }
191
-
192
- /**
193
- * 模板
194
- * @type {Object }
195
- */
196
- var Template = {
197
-
198
- body : '\
199
- <div class="pagination ${className}">\
200
- <ul>\
201
- ${itemList}\
202
- </ul>\
203
- </div>\
204
- ' ,
205
-
206
- item : '<li><a href="#" class="${className}" idx="${text}">${text}</a></li>'
207
- } ;
182
+ /**
183
+ * 设置当前激活的页码
184
+ * @param {[type] } argument [description]
185
+ */
186
+ function setActive ( $el ) {
187
+ var page = $el . data ( "page" ) ;
188
+ $ ( ".pagination > ul > li" , $el ) . removeClass ( "active" ) ;
189
+ $ ( "." + CLASS_NUM + "[idx=" + page + "]" , $el ) . parent ( ) . addClass ( "active" ) ;
190
+ }
191
+
192
+ /**
193
+ * 模板
194
+ * @type {Object }
195
+ */
196
+ var Template = {
197
+
198
+ body : '\
199
+ <div class="pagination ${className}">\
200
+ <ul>\
201
+ ${itemList}\
202
+ </ul>\
203
+ </div>\
204
+ ' ,
205
+
206
+ item : '<li><a href="#" class="${className}" idx="${text}">${text}</a></li>'
207
+ } ;
208
208
209
209
210
210
@@ -213,29 +213,29 @@ javascript
213
213
instance = $doc . data ( "pagination" ) ;
214
214
if ( ! instance ) $doc . data ( "pagination" , ( instance = new Pagination ( $ ( this ) , options ) ) ) ;
215
215
instance . render ( {
216
- page : options . page ,
217
- count : options . count
216
+ page : options . page ,
217
+ count : options . count
218
218
} ) ;
219
219
} ;
220
220
221
221
$ . fn . pagination . Constructor = Pagination ;
222
222
223
223
224
- /**
225
- * 默认Options
226
- * @type {Object }
227
- */
228
- $ . fn . pagination . defaults = {
229
- page : 1 , // require. current page no. default is 1.
230
- count : 1 , // require. total page count
231
- callback : $ . noop ( ) , // require. callbak when click
232
- num : 5 , // how many number shows
233
- className : "" , // additional class name
234
- refresh : true , // whether refresh when page no changes. Typically, this value set false when using ajax.
235
- title : { // title of the previous btn & next btn.
236
- prev : "«" ,
237
- next : "»"
238
- }
239
- }
224
+ /**
225
+ * 默认Options
226
+ * @type {Object }
227
+ */
228
+ $ . fn . pagination . defaults = {
229
+ page : 1 , // require. current page no. default is 1.
230
+ count : 1 , // require. total page count
231
+ callback : $ . noop ( ) , // require. callbak when click
232
+ num : 5 , // how many number shows
233
+ className : "" , // additional class name
234
+ refresh : true , // whether refresh when page no changes. Typically, this value set false when using ajax.
235
+ title : { // title of the previous btn & next btn.
236
+ prev : "«" ,
237
+ next : "»"
238
+ }
239
+ }
240
240
241
241
} ) ( jQuery ) ;
0 commit comments