![]()
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../resources/css/reset.css" type="text/css"
media="screen" />
<link rel="stylesheet" href="../resources/css/style.css" type="text/css"
media="screen" />
<link rel="stylesheet" href="../resources/css/invalid.css"
type="text/css" media="screen" />
<link rel="stylesheet"
href="../resources/css/south-street/jquery-ui-1.9.2.custom.css"
type="text/css" />
<!-- Javascripts -->
<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="../js/jquery-ui-1.9.2.custom.js"></script>
<!-- date -->
<script type="text/javascript"
src="../js/jquery.ui.datepicker-zh-CN.min.js"></script>
<script type="text/javascript" src="../js/util/datetwo.js"></script>
<!-- datatables -->
<script type="text/javascript"
src="../js/datatables/jquery.dataTables.js"></script>
<link rel="stylesheet" href="../resources/css/dataTables.jqueryui.css"
type="text/css" />
<script type="text/javascript" src="../js/util/datatablesini.js"></script>
</head>
<body>
<div id="testPager"></div>
</body>
<script type="text/javascript">
;(function($){
var currentDateTime=new Date();
var hh=currentDateTime.getHours(),mm=currentDateTime.getMinutes(),ss=currentDateTime.getSeconds();
//存放插件所需的属性字段
var TimeDivFields={
hour:hh,
min:mm,
sec:ss,
showResult:true
};
//插件的私有函数
function getTimeDiv(hh,mm,ss,showResult){
var selectHtml='<div class="ui-datepicker-timepanel ui-widget-content hhmmssDiv">';
selectHtml+='<select class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all ui-datepicker-hour" data-event="click">';
for(var h=0;h<24;h++){
selectHtml+='<option '+(hh==h?'selected="selected"':'')+'>'+(((h+"").length<2)?("0"+h):h)+'</option>';
}
selectHtml+='</select>小时<select class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all ui-datepicker-min" data-event="click">';
for(var m=0;m<60;m++){
selectHtml+='<option '+(mm==m?'selected="selected"':'')+'>'+((m+"").length<2?"0"+m:m)+'</option>';
}
selectHtml+='</select>分钟<select class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all ui-datepicker-sec" data-event="click">';
for(var s=0;s<60;s++){
selectHtml+='<option '+(ss==s?'selected="selected"':'')+'>'+((s+"").length<2?"0"+s:s)+'</option>';
}
selectHtml+=showResult?'</select>秒 =<input type="text" class="ui-datepicker-close ui-state-default ui-priority-primary ui-datepicker-result"/>秒</div>':'';
return selectHtml;
};
function getTime(mm){
var str=new Array();
str[0]=parseInt(mm/(60*60));
str[1]=parseInt(mm%(60*60)/60);
str[2]=parseInt(mm%(60*60)%60);
return str;
};
function getSelectedTime(obj,type){
var time="";
obj.find(".hhmmssDiv").find("select").find("option:selected").each(function(){
time+=":"+$(this).text();
});
time=time.substring(1, time.length);
if(type==1){
return time;
}else{
var s=time.split(":");
return parseInt(s[0]*60*60)+parseInt(s[1]*60)+parseInt(s[2]);
}
};
//插件的公共函数
var methods={
_TimeDivFields:null,
ini:function(option){
_TimeDivFields=TimeDivFields;
return this.each(function () {
var $this = $(this);
jQuery.extend(_TimeDivFields,option);
$this.append(getTimeDiv(_TimeDivFields.hour,_TimeDivFields.min,_TimeDivFields.sec,_TimeDivFields.showResult));
//下拉框值改变
$this.find(".hhmmssDiv").find("select").bind("change",function(){
$this.find(".hhmmssDiv .ui-datepicker-result").val(getSelectedTime($this,0));
});
//改变文本框
$this.find(".hhmmssDiv").find("select").change();
//文本框值改变
$this.find(".hhmmssDiv .ui-datepicker-result").bind("blur",function(){
var sec=$(this).val();
var time=getTime(sec);
$this.find(".hhmmssDiv .ui-datepicker-hour").get(0).selectedIndex=time[0];
$this.find(".hhmmssDiv .ui-datepicker-min").get(0).selectedIndex=time[1];
$this.find(".hhmmssDiv .ui-datepicker-sec").get(0).selectedIndex=time[2];
});
});
},
getTime:function(){
return getSelectedTime($(this),1);
},
getSec:function(){
return getSelectedTime($(this),0);
}
};
//定义插件
$.fn.TimeDiv = function () {
var method = arguments[0];
if (methods[method]) {
method = methods[method];
arguments = Array.prototype.slice.call(arguments, 1);
}
else if (typeof (method) == 'object' || !method) {
method = methods.ini;
}
else {
$.error('Method ' + method + ' does not exist on jQuery.pluginName');
return this;
}
return method.apply(this, arguments);
};
$.fn.calSec=function(mm){
return getTime(mm);
}
})(jQuery);
//$(function () {
// try{
// $("#testPager").TimeDiv({hour:20,min:59});
// alert($("#testPager").TimeDiv("getTime"));
// alert($().calSec(1000));
//}catch(e){alert(e.message);}
//});
</script>
</html>
浙公网安备 33010602011771号