diff --git a/README.md b/README.md
index e618e74..aab56a2 100644
--- a/README.md
+++ b/README.md
@@ -15,7 +15,7 @@ http://pgkk.github.io/kkpager/example/pager_test_clickmode.html
 ```
 ### HTML DOM容器
 ```html
-<div id="kkpager"></div>
+<div class="kkpager" id="kkpager_XXXX"></div>
 ```
 ### 调用方法
 
@@ -23,7 +23,9 @@ http://pgkk.github.io/kkpager/example/pager_test_clickmode.html
 ```html
 <script type="text/javascript">
 //生成分页控件  
+kkpager = getKKPagerObject('kkpager_XXXX');
 kkpager.generPageHtml({
+	pagerid : 'kkpager_XXXX',
 	pno : '${p.pageNo}',
 	mode : 'link', //可选，默认就是link
 	//总页码  
@@ -58,7 +60,9 @@ getLink 参数需要按需要重写。
 ```html
 <script type="text/javascript">
 //生成分页控件  
+kkpager = getKKPagerObject('kkpager_XXXX');
 kkpager.generPageHtml({
+	pagerid : 'kkpager_XXXX',
 	pno : '${p.pageNo}',
 	mode : 'click', //设置为click模式
 	//总页码  
diff --git a/src/kkpager.js b/src/kkpager.js
index 5354916..0618355 100644
--- a/src/kkpager.js
+++ b/src/kkpager.js
@@ -5,244 +5,209 @@
   Copyright (c) 2013 cqzhangkang@163.com
   Licensed under the GNU GENERAL PUBLIC LICENSE
 */
-var kkpager = {
-		pagerid 			: 'kkpager', //divID
-		mode				: 'link', //模式(link 或者 click)
-		pno					: 1, //当前页码
-		total				: 1, //总页码
-		totalRecords		: 0, //总数据条数
-		isShowFirstPageBtn	: true, //是否显示首页按钮
-		isShowLastPageBtn	: true, //是否显示尾页按钮
-		isShowPrePageBtn	: true, //是否显示上一页按钮
-		isShowNextPageBtn	: true, //是否显示下一页按钮
-		isShowTotalPage 	: true, //是否显示总页数
-		isShowCurrPage		: true,//是否显示当前页
-		isShowTotalRecords 	: false, //是否显示总记录数
-		isGoPage 			: true,	//是否显示页码跳转输入框
-		isWrapedPageBtns	: true,	//是否用span包裹住页码按钮
-		isWrapedInfoTextAndGoPageBtn : true, //是否用span包裹住分页信息和跳转按钮
-		hrefFormer			: '', //链接前部
-		hrefLatter			: '', //链接尾部
-		gopageWrapId		: 'kkpager_gopage_wrap',
-		gopageButtonId		: 'kkpager_btn_go',
-		gopageTextboxId		: 'kkpager_btn_go_input',
-		lang				: {
-			firstPageText			: '首页',
-			firstPageTipText		: '首页',
-			lastPageText			: '尾页',
-			lastPageTipText			: '尾页',
-			prePageText				: '上一页',
-			prePageTipText			: '上一页',
-			nextPageText			: '下一页',
-			nextPageTipText			: '下一页',
-			totalPageBeforeText		: '共',
-			totalPageAfterText		: '页',
-			currPageBeforeText		: '当前第',
-			currPageAfterText		: '页',
-			totalInfoSplitStr		: '/',
-			totalRecordsBeforeText	: '共',
-			totalRecordsAfterText	: '条数据',
-			gopageBeforeText		: '&nbsp;转到',
-			gopageButtonOkText		: '确定',
-			gopageAfterText			: '页',
-			buttonTipBeforeText		: '第',
-			buttonTipAfterText		: '页'
-		},
-		//链接算法（当处于link模式）,参数n为页码
-		getLink	: function(n){
-			//这里的算法适用于比如：
-			//hrefFormer=http://www.xx.com/news/20131212
-			//hrefLatter=.html
-			//那么首页（第1页）就是http://www.xx.com/news/20131212.html
-			//第2页就是http://www.xx.com/news/20131212_2.html
-			//第n页就是http://www.xx.com/news/20131212_n.html
-			if(n == 1){
-				return this.hrefFormer + this.hrefLatter;
-			}
-			return this.hrefFormer + '_' + n + this.hrefLatter;
-		},
-		//页码单击事件处理函数（当处于mode模式）,参数n为页码
-		click	: function(n){
-			//这里自己实现
-			//这里可以用this或者kkpager访问kkpager对象
-			return false;
-		},
-		//获取href的值（当处于mode模式）,参数n为页码
-		getHref	: function(n){
-			//默认返回'#'
-			return '#';
-		},
-		//跳转框得到输入焦点时
-		focus_gopage : function (){
-			var btnGo = $('#'+this.gopageButtonId);
-			$('#'+this.gopageTextboxId).attr('hideFocus',true);
-			btnGo.show();
-			btnGo.css('left','10px');
-			$('#'+this.gopageTextboxId).addClass('focus');
-			btnGo.animate({left: '+=30'}, 50);
-		},
-		//跳转框失去输入焦点时
-		blur_gopage : function(){
-			var _this = this;
-			setTimeout(function(){
-				var btnGo = $('#'+_this.gopageButtonId);
-				btnGo.animate({
-				    left: '-=25'
-				  }, 100, function(){
-					  btnGo.hide();
-					  $('#'+_this.gopageTextboxId).removeClass('focus');
-				  });
-			},400);
-		},
-		//跳转输入框按键操作
-		keypress_gopage : function(){
-			var event = arguments[0] || window.event;
-			var code = event.keyCode || event.charCode;
-			//delete key
-			if(code == 8) return true;
-			//enter key
-			if(code == 13){
-				kkpager.gopage();
+var kkpager;
+function getKKPagerObject(pagerId){
+	var kkpager = {
+			pagerid 			: pagerId, //divID
+			mode				: 'link', //模式(link 或者 click)
+			pno					: 1, //当前页码
+			total				: 1, //总页码
+			totalRecords		: 0, //总数据条数
+			isShowFirstPageBtn	: true, //是否显示首页按钮
+			isShowLastPageBtn	: true, //是否显示尾页按钮
+			isShowPrePageBtn	: true, //是否显示上一页按钮
+			isShowNextPageBtn	: true, //是否显示下一页按钮
+			isShowTotalPage 	: true, //是否显示总页数
+			isShowCurrPage		: true,//是否显示当前页
+			isShowTotalRecords 	: false, //是否显示总记录数
+			isGoPage 			: true,	//是否显示页码跳转输入框
+			isWrapedPageBtns	: true,	//是否用span包裹住页码按钮
+			isWrapedInfoTextAndGoPageBtn : true, //是否用span包裹住分页信息和跳转按钮
+			hrefFormer			: '', //链接前部
+			hrefLatter			: '', //链接尾部
+			gopageWrapId		: 'kkpager_gopage_wrap',
+			gopageButtonId		: 'kkpager_btn_go',
+			gopageTextboxId		: 'kkpager_btn_go_input',
+			lang				: {
+				firstPageText			: '首页',
+				firstPageTipText		: '首页',
+				lastPageText			: '尾页',
+				lastPageTipText			: '尾页',
+				prePageText				: '上一页',
+				prePageTipText			: '上一页',
+				nextPageText			: '下一页',
+				nextPageTipText			: '下一页',
+				totalPageBeforeText		: '共',
+				totalPageAfterText		: '页',
+				currPageBeforeText		: '当前第',
+				currPageAfterText		: '页',
+				totalInfoSplitStr		: '/',
+				totalRecordsBeforeText	: '共',
+				totalRecordsAfterText	: '条数据',
+				gopageBeforeText		: '&nbsp;转到',
+				gopageButtonOkText		: '确定',
+				gopageAfterText			: '页',
+				buttonTipBeforeText		: '第',
+				buttonTipAfterText		: '页'
+			},
+			//链接算法（当处于link模式）,参数n为页码
+			getLink	: function(n){
+				//这里的算法适用于比如：
+				//hrefFormer=http://www.xx.com/news/20131212
+				//hrefLatter=.html
+				//那么首页（第1页）就是http://www.xx.com/news/20131212.html
+				//第2页就是http://www.xx.com/news/20131212_2.html
+				//第n页就是http://www.xx.com/news/20131212_n.html
+				if(n == 1){
+					return this.hrefFormer + this.hrefLatter;
+				}
+				return this.hrefFormer + '_' + n + this.hrefLatter;
+			},
+			//页码单击事件处理函数（当处于mode模式）,参数n为页码
+			click	: function(n){
+				//这里自己实现
+				//这里可以用this或者kkpager访问kkpager对象
 				return false;
-			}
-			//copy and paste
-			if(event.ctrlKey && (code == 99 || code == 118)) return true;
-			//only number key
-			if(code<48 || code>57)return false;
-			return true;
-		},
-		//跳转框页面跳转
-		gopage : function(){
-			var str_page = $('#'+this.gopageTextboxId).val();
-			if(isNaN(str_page)){
-				$('#'+this.gopageTextboxId).val(this.next);
-				return;
-			}
-			var n = parseInt(str_page);
-			if(n < 1) n = 1;
-			if(n > this.total) n = this.total;
-			if(this.mode == 'click'){
-				this._clickHandler(n);
-			}else{
-				window.location = this.getLink(n);
-			}
-		},
-		//不刷新页面直接手动调用选中某一页码
-		selectPage : function(n){
-			this._config['pno'] = n;
-			this.generPageHtml(this._config,true);
-		},
-		//生成控件代码
-		generPageHtml : function(config,enforceInit){
-			if(enforceInit || !this.inited){
-				this.init(config);
-			}
-			
-			var str_first='',str_prv='',str_next='',str_last='';
-			if(this.isShowFirstPageBtn){
-				if(this.hasPrv){
-					str_first = '<a '+this._getHandlerStr(1)+' title="'
-						+(this.lang.firstPageTipText || this.lang.firstPageText)+'">'+this.lang.firstPageText+'</a>';
-				}else{
-					str_first = '<span class="disabled">'+this.lang.firstPageText+'</span>';
+			},
+			//获取href的值（当处于mode模式）,参数n为页码
+			getHref	: function(n){
+				//默认返回'#'
+				return '#';
+			},
+			//跳转框得到输入焦点时
+			focus_gopage : function (){
+				var btnGo = $('#'+this.gopageButtonId);
+				$('#'+this.gopageTextboxId).attr('hideFocus',true);
+				btnGo.show();
+				btnGo.css('left','10px');
+				$('#'+this.gopageTextboxId).addClass('focus');
+				btnGo.animate({left: '+=30'}, 50);
+			},
+			//跳转框失去输入焦点时
+			blur_gopage : function(){
+				var _this = this;
+				setTimeout(function(){
+					var btnGo = $('#'+_this.gopageButtonId);
+					btnGo.animate({
+					    left: '-=25'
+					  }, 100, function(){
+						  btnGo.hide();
+						  $('#'+_this.gopageTextboxId).removeClass('focus');
+					  });
+				},400);
+			},
+			//跳转输入框按键操作
+			keypress_gopage : function(){
+				var event = arguments[0] || window.event;
+				var code = event.keyCode || event.charCode;
+				//delete key
+				if(code == 8) return true;
+				//enter key
+				if(code == 13){
+					kkpager.gopage();
+					return false;
 				}
-			}
-			if(this.isShowPrePageBtn){
-				if(this.hasPrv){
-					str_prv = '<a '+this._getHandlerStr(this.prv)+' title="'
-						+(this.lang.prePageTipText || this.lang.prePageText)+'">'+this.lang.prePageText+'</a>';
-				}else{
-					str_prv = '<span class="disabled">'+this.lang.prePageText+'</span>';
+				//copy and paste
+				if(event.ctrlKey && (code == 99 || code == 118)) return true;
+				//only number key
+				if(code<48 || code>57)return false;
+				return true;
+			},
+			//跳转框页面跳转
+			gopage : function(){
+				var str_page = $('#'+this.gopageTextboxId).val();
+				if(isNaN(str_page)){
+					$('#'+this.gopageTextboxId).val(this.next);
+					return;
 				}
-			}
-			if(this.isShowNextPageBtn){
-				if(this.hasNext){
-					str_next = '<a '+this._getHandlerStr(this.next)+' title="'
-						+(this.lang.nextPageTipText || this.lang.nextPageText)+'">'+this.lang.nextPageText+'</a>';
+				var n = parseInt(str_page);
+				if(n < 1) n = 1;
+				if(n > this.total) n = this.total;
+				if(this.mode == 'click'){
+					this._clickHandler(n);
 				}else{
-					str_next = '<span class="disabled">'+this.lang.nextPageText+'</span>';
+					window.location = this.getLink(n);
 				}
-			}
-			if(this.isShowLastPageBtn){
-				if(this.hasNext){
-					str_last = '<a '+this._getHandlerStr(this.total)+' title="'
-						+(this.lang.lastPageTipText || this.lang.lastPageText)+'">'+this.lang.lastPageText+'</a>';
-				}else{
-					str_last = '<span class="disabled">'+this.lang.lastPageText+'</span>';
+			},
+			//不刷新页面直接手动调用选中某一页码
+			selectPage : function(n){
+				this._config['pno'] = n;
+				this.generPageHtml(this._config,true);
+			},
+			//生成控件代码
+			generPageHtml : function(config,enforceInit){
+				if(enforceInit || !this.inited){
+					this.init(config);
 				}
-			}
-			var str = '';
-			var dot = '<span class="spanDot">...</span>';
-			var total_info='<span class="totalText">';
-			var total_info_splitstr = '<span class="totalInfoSplitStr">'+this.lang.totalInfoSplitStr+'</span>';
-			if(this.isShowCurrPage){
-				total_info += this.lang.currPageBeforeText + '<span class="currPageNum">' + this.pno + '</span>' + this.lang.currPageAfterText;
-				if(this.isShowTotalPage){
-					total_info += total_info_splitstr;
-					total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;
-				}else if(this.isShowTotalRecords){
-					total_info += total_info_splitstr;
-					total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
+				
+				var str_first='',str_prv='',str_next='',str_last='';
+				if(this.isShowFirstPageBtn){
+					if(this.hasPrv){
+						str_first = '<a '+this._getHandlerStr(1)+' title="'
+							+(this.lang.firstPageTipText || this.lang.firstPageText)+'">'+this.lang.firstPageText+'</a>';
+					}else{
+						str_first = '<span class="disabled">'+this.lang.firstPageText+'</span>';
+					}
 				}
-			}else if(this.isShowTotalPage){
-				total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;;
-				if(this.isShowTotalRecords){
-					total_info += total_info_splitstr;
-					total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
+				if(this.isShowPrePageBtn){
+					if(this.hasPrv){
+						str_prv = '<a '+this._getHandlerStr(this.prv)+' title="'
+							+(this.lang.prePageTipText || this.lang.prePageText)+'">'+this.lang.prePageText+'</a>';
+					}else{
+						str_prv = '<span class="disabled">'+this.lang.prePageText+'</span>';
+					}
 				}
-			}else if(this.isShowTotalRecords){
-				total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
-			}
-			total_info += '</span>';
-			
-			var gopage_info = '';
-			if(this.isGoPage){
-				gopage_info = '<span class="goPageBox">'+this.lang.gopageBeforeText+'<span id="'+this.gopageWrapId+'">'+
-					'<input type="button" id="'+this.gopageButtonId+'" onclick="kkpager.gopage()" value="'
-						+this.lang.gopageButtonOkText+'" />'+
-					'<input type="text" id="'+this.gopageTextboxId+'" onfocus="kkpager.focus_gopage()"  onkeypress="return kkpager.keypress_gopage(event);"   onblur="kkpager.blur_gopage()" value="'+this.next+'" /></span>'+this.lang.gopageAfterText+'</span>';
-			}
-			
-			//分页处理
-			if(this.total <= 8){
-				for(var i=1;i<=this.total;i++){
-					if(this.pno == i){
-						str += '<span class="curr">'+i+'</span>';
+				if(this.isShowNextPageBtn){
+					if(this.hasNext){
+						str_next = '<a '+this._getHandlerStr(this.next)+' title="'
+							+(this.lang.nextPageTipText || this.lang.nextPageText)+'">'+this.lang.nextPageText+'</a>';
 					}else{
-						str += '<a '+this._getHandlerStr(i)+' title="'
-							+this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
+						str_next = '<span class="disabled">'+this.lang.nextPageText+'</span>';
 					}
 				}
-			}else{
-				if(this.pno <= 5){
-					for(var i=1;i<=7;i++){
-						if(this.pno == i){
-							str += '<span class="curr">'+i+'</span>';
-						}else{
-							str += '<a '+this._getHandlerStr(i)+' title="'+
-								this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
-						}
+				if(this.isShowLastPageBtn){
+					if(this.hasNext){
+						str_last = '<a '+this._getHandlerStr(this.total)+' title="'
+							+(this.lang.lastPageTipText || this.lang.lastPageText)+'">'+this.lang.lastPageText+'</a>';
+					}else{
+						str_last = '<span class="disabled">'+this.lang.lastPageText+'</span>';
 					}
-					str += dot;
-				}else{
-					str += '<a '+this._getHandlerStr(1)+' title="'
-						+this.lang.buttonTipBeforeText + '1' + this.lang.buttonTipAfterText+'">1</a>';
-					str += '<a '+this._getHandlerStr(2)+' title="'
-						+this.lang.buttonTipBeforeText + '2' + this.lang.buttonTipAfterText +'">2</a>';
-					str += dot;
-					
-					var begin = this.pno - 2;
-					var end = this.pno + 2;
-					if(end > this.total){
-						end = this.total;
-						begin = end - 4;
-						if(this.pno - begin < 2){
-							begin = begin-1;
-						}
-					}else if(end + 1 == this.total){
-						end = this.total;
+				}
+				var str = '';
+				var dot = '<span class="spanDot">...</span>';
+				var total_info='<span class="totalText">';
+				var total_info_splitstr = '<span class="totalInfoSplitStr">'+this.lang.totalInfoSplitStr+'</span>';
+				if(this.isShowCurrPage){
+					total_info += this.lang.currPageBeforeText + '<span class="currPageNum">' + this.pno + '</span>' + this.lang.currPageAfterText;
+					if(this.isShowTotalPage){
+						total_info += total_info_splitstr;
+						total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;
+					}else if(this.isShowTotalRecords){
+						total_info += total_info_splitstr;
+						total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
 					}
-					for(var i=begin;i<=end;i++){
+				}else if(this.isShowTotalPage){
+					total_info += this.lang.totalPageBeforeText + '<span class="totalPageNum">'+this.total + '</span>' + this.lang.totalPageAfterText;;
+					if(this.isShowTotalRecords){
+						total_info += total_info_splitstr;
+						total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
+					}
+				}else if(this.isShowTotalRecords){
+					total_info += this.lang.totalRecordsBeforeText + '<span class="totalRecordNum">'+this.totalRecords + '</span>' + this.lang.totalRecordsAfterText;
+				}
+				total_info += '</span>';
+				
+				var gopage_info = '';
+				if(this.isGoPage){
+					gopage_info = '<span class="goPageBox">'+this.lang.gopageBeforeText+'<span id="'+this.gopageWrapId+'">'+
+						'<input type="button" id="'+this.gopageButtonId+'" onclick="kkpager.gopage()" value="'
+							+this.lang.gopageButtonOkText+'" />'+
+						'<input type="text" id="'+this.gopageTextboxId+'" onfocus="kkpager.focus_gopage()"  onkeypress="return kkpager.keypress_gopage(event);"   onblur="kkpager.blur_gopage()" value="'+this.next+'" /></span>'+this.lang.gopageAfterText+'</span>';
+				}
+				
+				//分页处理
+				if(this.total <= 8){
+					for(var i=1;i<=this.total;i++){
 						if(this.pno == i){
 							str += '<span class="curr">'+i+'</span>';
 						}else{
@@ -250,81 +215,121 @@ var kkpager = {
 								+this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
 						}
 					}
-					if(end != this.total){
+				}else{
+					if(this.pno <= 5){
+						for(var i=1;i<=7;i++){
+							if(this.pno == i){
+								str += '<span class="curr">'+i+'</span>';
+							}else{
+								str += '<a '+this._getHandlerStr(i)+' title="'+
+									this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
+							}
+						}
+						str += dot;
+					}else{
+						str += '<a '+this._getHandlerStr(1)+' title="'
+							+this.lang.buttonTipBeforeText + '1' + this.lang.buttonTipAfterText+'">1</a>';
+						str += '<a '+this._getHandlerStr(2)+' title="'
+							+this.lang.buttonTipBeforeText + '2' + this.lang.buttonTipAfterText +'">2</a>';
 						str += dot;
+						
+						var begin = this.pno - 2;
+						var end = this.pno + 2;
+						if(end > this.total){
+							end = this.total;
+							begin = end - 4;
+							if(this.pno - begin < 2){
+								begin = begin-1;
+							}
+						}else if(end + 1 == this.total){
+							end = this.total;
+						}
+						for(var i=begin;i<=end;i++){
+							if(this.pno == i){
+								str += '<span class="curr">'+i+'</span>';
+							}else{
+								str += '<a '+this._getHandlerStr(i)+' title="'
+									+this.lang.buttonTipBeforeText + i + this.lang.buttonTipAfterText+'">'+i+'</a>';
+							}
+						}
+						if(end != this.total){
+							str += dot;
+						}
 					}
 				}
-			}
-			var pagerHtml = '<div>';
-			if(this.isWrapedPageBtns){
-				pagerHtml += '<span class="pageBtnWrap">' + str_first + str_prv + str + str_next + str_last + '</span>'
-			}else{
-				pagerHtml += str_first + str_prv + str + str_next + str_last;
-			}
-			if(this.isWrapedInfoTextAndGoPageBtn){
-				pagerHtml += '<span class="infoTextAndGoPageBtnWrap">' + total_info + gopage_info + '</span>';
-			}else{
-				pagerHtml += total_info + gopage_info;
-			}
-			pagerHtml += '</div><div style="clear:both;"></div>';
-			$("#"+this.pagerid).html(pagerHtml);
-		},
-		//分页按钮控件初始化
-		init : function(config){
-			this.pno = isNaN(config.pno) ? 1 : parseInt(config.pno);
-			this.total = isNaN(config.total) ? 1 : parseInt(config.total);
-			this.totalRecords = isNaN(config.totalRecords) ? 0 : parseInt(config.totalRecords);
-			if(config.pagerid){this.pagerid = config.pagerid;}
-			if(config.mode){this.mode = config.mode;}
-			if(config.gopageWrapId){this.gopageWrapId = config.gopageWrapId;}
-			if(config.gopageButtonId){this.gopageButtonId = config.gopageButtonId;}
-			if(config.gopageTextboxId){this.gopageTextboxId = config.gopageTextboxId;}
-			if(config.isShowFirstPageBtn != undefined){this.isShowFirstPageBtn=config.isShowFirstPageBtn;}
-			if(config.isShowLastPageBtn != undefined){this.isShowLastPageBtn=config.isShowLastPageBtn;}
-			if(config.isShowPrePageBtn != undefined){this.isShowPrePageBtn=config.isShowPrePageBtn;}
-			if(config.isShowNextPageBtn != undefined){this.isShowNextPageBtn=config.isShowNextPageBtn;}
-			if(config.isShowTotalPage != undefined){this.isShowTotalPage=config.isShowTotalPage;}
-			if(config.isShowCurrPage != undefined){this.isShowCurrPage=config.isShowCurrPage;}
-			if(config.isShowTotalRecords != undefined){this.isShowTotalRecords=config.isShowTotalRecords;}
-			if(config.isWrapedPageBtns){this.isWrapedPageBtns=config.isWrapedPageBtns;}
-			if(config.isWrapedInfoTextAndGoPageBtn){this.isWrapedInfoTextAndGoPageBtn=config.isWrapedInfoTextAndGoPageBtn;}
-			if(config.isGoPage != undefined){this.isGoPage=config.isGoPage;}
-			if(config.lang){
-				for(var key in config.lang){
-					this.lang[key] = config.lang[key];
+				var pagerHtml = '<div>';
+				if(this.isWrapedPageBtns){
+					pagerHtml += '<span class="pageBtnWrap">' + str_first + str_prv + str + str_next + str_last + '</span>'
+				}else{
+					pagerHtml += str_first + str_prv + str + str_next + str_last;
 				}
+				if(this.isWrapedInfoTextAndGoPageBtn){
+					pagerHtml += '<span class="infoTextAndGoPageBtnWrap">' + total_info + gopage_info + '</span>';
+				}else{
+					pagerHtml += total_info + gopage_info;
+				}
+				pagerHtml += '</div><div style="clear:both;"></div>';
+				$("#"+this.pagerid).html(pagerHtml);
+			},
+			//分页按钮控件初始化
+			init : function(config){
+				this.pno = isNaN(config.pno) ? 1 : parseInt(config.pno);
+				this.total = isNaN(config.total) ? 1 : parseInt(config.total);
+				this.totalRecords = isNaN(config.totalRecords) ? 0 : parseInt(config.totalRecords);
+				if(config.pagerid){this.pagerid = config.pagerid;}
+				if(config.mode){this.mode = config.mode;}
+				if(config.gopageWrapId){this.gopageWrapId = config.gopageWrapId;}
+				if(config.gopageButtonId){this.gopageButtonId = config.gopageButtonId;}
+				if(config.gopageTextboxId){this.gopageTextboxId = config.gopageTextboxId;}
+				if(config.isShowFirstPageBtn != undefined){this.isShowFirstPageBtn=config.isShowFirstPageBtn;}
+				if(config.isShowLastPageBtn != undefined){this.isShowLastPageBtn=config.isShowLastPageBtn;}
+				if(config.isShowPrePageBtn != undefined){this.isShowPrePageBtn=config.isShowPrePageBtn;}
+				if(config.isShowNextPageBtn != undefined){this.isShowNextPageBtn=config.isShowNextPageBtn;}
+				if(config.isShowTotalPage != undefined){this.isShowTotalPage=config.isShowTotalPage;}
+				if(config.isShowCurrPage != undefined){this.isShowCurrPage=config.isShowCurrPage;}
+				if(config.isShowTotalRecords != undefined){this.isShowTotalRecords=config.isShowTotalRecords;}
+				if(config.isWrapedPageBtns){this.isWrapedPageBtns=config.isWrapedPageBtns;}
+				if(config.isWrapedInfoTextAndGoPageBtn){this.isWrapedInfoTextAndGoPageBtn=config.isWrapedInfoTextAndGoPageBtn;}
+				if(config.isGoPage != undefined){this.isGoPage=config.isGoPage;}
+				if(config.lang){
+					for(var key in config.lang){
+						this.lang[key] = config.lang[key];
+					}
+				}
+				this.hrefFormer = config.hrefFormer || '';
+				this.hrefLatter = config.hrefLatter || '';
+				if(config.getLink && typeof(config.getLink) == 'function'){this.getLink = config.getLink;}
+				if(config.click && typeof(config.click) == 'function'){this.click = config.click;}
+				if(config.getHref && typeof(config.getHref) == 'function'){this.getHref = config.getHref;}
+				if(!this._config){
+					this._config = config;
+				}
+				//validate
+				if(this.pno < 1) this.pno = 1;
+				this.total = (this.total <= 1) ? 1: this.total;
+				if(this.pno > this.total) this.pno = this.total;
+				this.prv = (this.pno<=2) ? 1 : (this.pno-1);
+				this.next = (this.pno >= this.total-1) ? this.total : (this.pno + 1);
+				this.hasPrv = (this.pno > 1);
+				this.hasNext = (this.pno < this.total);
+				
+				this.inited = true;
+			},
+			_getHandlerStr : function(n){
+				if(this.mode == 'click'){
+					return 'href="'+this.getHref(n)+'" onclick="return kkpager._clickHandler('+n+')"';
+				}
+				//link模式，也是默认的
+				return 'href="'+this.getLink(n)+'"';
+			},
+			_clickHandler	: function(n){
+				var res = false;
+				if(this.click && typeof this.click == 'function'){
+					res = this.click.call(this,n) || false;
+				}
+				return res;
 			}
-			this.hrefFormer = config.hrefFormer || '';
-			this.hrefLatter = config.hrefLatter || '';
-			if(config.getLink && typeof(config.getLink) == 'function'){this.getLink = config.getLink;}
-			if(config.click && typeof(config.click) == 'function'){this.click = config.click;}
-			if(config.getHref && typeof(config.getHref) == 'function'){this.getHref = config.getHref;}
-			if(!this._config){
-				this._config = config;
-			}
-			//validate
-			if(this.pno < 1) this.pno = 1;
-			this.total = (this.total <= 1) ? 1: this.total;
-			if(this.pno > this.total) this.pno = this.total;
-			this.prv = (this.pno<=2) ? 1 : (this.pno-1);
-			this.next = (this.pno >= this.total-1) ? this.total : (this.pno + 1);
-			this.hasPrv = (this.pno > 1);
-			this.hasNext = (this.pno < this.total);
-			
-			this.inited = true;
-		},
-		_getHandlerStr : function(n){
-			if(this.mode == 'click'){
-				return 'href="'+this.getHref(n)+'" onclick="return kkpager._clickHandler('+n+')"';
-			}
-			//link模式，也是默认的
-			return 'href="'+this.getLink(n)+'"';
-		},
-		_clickHandler	: function(n){
-			var res = false;
-			if(this.click && typeof this.click == 'function'){
-				res = this.click.call(this,n) || false;
-			}
-			return res;
-		}
-};
\ No newline at end of file
+	};
+	
+	return kkpager;
+}
diff --git a/src/kkpager_blue.css b/src/kkpager_blue.css
index a1dace0..373d432 100644
--- a/src/kkpager_blue.css
+++ b/src/kkpager_blue.css
@@ -1,10 +1,10 @@
-#kkpager{
+.kkpager{
 	clear:both;
 	color:#999;
 	padding:5px 0px 5px 0px;
 	font-size:13px;
 }
-#kkpager a{
+.kkpager a{
 	float: left;
 	border: 1px solid #ccc;
 	display: inline;
@@ -19,7 +19,7 @@
 	color:#999;
 }
 
-#kkpager span.disabled{
+.kkpager span.disabled{
 	float: left;
 	display: inline;
 	padding: 3px 10px 3px 10px;
@@ -31,7 +31,7 @@
 	background-color:#FFF;
 	color:#DFDFDF;
 }
-#kkpager span.curr{
+.kkpager span.curr{
 	float: left;
 	border: 1px solid #31ACE2;
 	display: inline;
@@ -43,12 +43,12 @@
 	background: #F0FDFF;
 	color: #31ACE2;
 }
-#kkpager a:hover{
+.kkpager a:hover{
 	border:1px solid #31ACE2; 
 	background-color:#31ACE2; 
 	color:#fff;
 }
-#kkpager span.normalsize{
+.kkpager span.normalsize{
 }
 #kkpager_gopage_wrap{
 	position:relative;
@@ -94,21 +94,21 @@
 	border-color:#31ACE2;
 }
 
-#kkpager .pageBtnWrap{
+.kkpager .pageBtnWrap{
 	float:left;
 }
-#kkpager .infoTextAndGoPageBtnWrap{
+.kkpager .infoTextAndGoPageBtnWrap{
 	float:right;
 }
-#kkpager .spanDot{
+.kkpager .spanDot{
 	float:left;
 	margin-right:5px;
 }
 
-#kkpager .currPageNum{
+.kkpager .currPageNum{
 	color:#FD7F4D;
 }
 
-#kkpager .infoTextAndGoPageBtnWrap{
+.kkpager .infoTextAndGoPageBtnWrap{
 	padding-top:5px;
-}
\ No newline at end of file
+}
diff --git a/src/kkpager_orange.css b/src/kkpager_orange.css
index 43c5bfa..d8587c6 100644
--- a/src/kkpager_orange.css
+++ b/src/kkpager_orange.css
@@ -1,10 +1,10 @@
-#kkpager{
+.kkpager{
 	clear:both;
 	color:#999;
 	padding:5px 0px 5px 0px;
 	font-size:13px;
 }
-#kkpager a{
+.kkpager a{
 	float: left;
 	border: 1px solid #ccc;
 	display: inline;
@@ -19,7 +19,7 @@
 	color:#999;
 }
 
-#kkpager span.disabled{
+.kkpager span.disabled{
 	float: left;
 	display: inline;
 	padding: 3px 10px 3px 10px;
@@ -31,7 +31,7 @@
 	background-color:#FFF;
 	color:#DFDFDF;
 }
-#kkpager span.curr{
+.kkpager span.curr{
 	float: left;
 	border: 1px solid #FF6600;
 	display: inline;
@@ -43,12 +43,12 @@
 	background: #FFEEE5;
 	color: #FF6600;
 }
-#kkpager a:hover{
+.kkpager a:hover{
 	border:1px solid #FF6600; 
 	background-color:#FF6600; 
 	color:#fff;
 }
-#kkpager span.normalsize{
+.kkpager span.normalsize{
 }
 #kkpager_gopage_wrap{
 	position:relative;
@@ -94,21 +94,21 @@
 	border-color:#FF6600;
 }
 
-#kkpager .pageBtnWrap{
+.kkpager .pageBtnWrap{
 	float:left;
 }
-#kkpager .infoTextAndGoPageBtnWrap{
+.kkpager .infoTextAndGoPageBtnWrap{
 	float:right;
 }
-#kkpager .spanDot{
+.kkpager .spanDot{
 	float:left;
 	margin-right:5px;
 }
 
-#kkpager .currPageNum{
+.kkpager .currPageNum{
 	color:#FD7F4D;
 }
 
-#kkpager .infoTextAndGoPageBtnWrap{
+.kkpager .infoTextAndGoPageBtnWrap{
 	padding-top:5px;
-}
\ No newline at end of file
+}