datetime.js

这是我上次报java培训时

  var cmd = event.srcElement.innerText=="5"?true:false;
  var i = parseInt(this.fObj.value,10);
  var radix = parseInt(this.fObj.radix,10)-1;
  if (i==radix&&cmd) {
   i = 0;
  } else if (i==0&&!cmd) {
   i = radix;
  } else {
   cmd?i++:i--;
  }
  this.fObj.value = this.formatTime(i);
  this.fObj.select();
 }
 this.setTime = function(obj) {
  obj.value = this.formatTime(obj.value);
 }
 this.setFocusObj = function(obj) {
  eval(this.Name+"_TimeInputUp").disabled = eval(this.Name+"_TimeInputDown").disabled = false;
  this.fObj = obj;
 }
 this.getTime = function() {
  var arrTime = new Array(2);
  var fName = this.Name+"_TimeInput";
  for (var i=0;i<document.getElementsByName(fName).length;i++) {
   arrTime[i] = document.getElementsByName(fName)[i].value;
  }
  return arrTime.join(":")
 }
 this.setInitControl=function(){
  var iTime=eval("document.all."+forObj+".value");
  var arrTime=new Array();

  arrTime=str2Array(iTime,":");
  for (var i=0;i<arrTime.length;i++){
   document.getElementsByName(this.fName)[i].value=arrTime[i];
  }
 }

  this.CreateTimeCtrl = function(){
	/*
	var sMinute_Common = "style = \""+this.mctr_input + "\" maxlength=\"2\" name=\""+this.Name+"_TimeInput\" onfocus=\""+
	   "document.jsMonthView.setFocusObj(this)\" onChange=\""+"document.jsMonthView.setTime(this)\" onkeyup=\""+
	   "document.jsMonthView.prevent(this)\" onkeypress=\"if (!/[0-9]/.test(String.fromCharCode(event.keyCode)))event.keyCode=0\" \onpaste=\"return false\" ondragenter=\"return false\" style=\"ime-mode:disabled\"  onPropertychange=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\"";
	var sButton_Common =  "style = \""+this.mctr_arrow + "\" onClick=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\" disabled";
	*/
	var sMinute_Common = "class=\"mctr_input\" maxlength=\"2\" name=\""+this.Name+"_TimeInput\" onfocus=\""+
	   "document.jsMonthView.setFocusObj(this)\" onChange=\""+"document.jsMonthView.setTime(this)\" onkeyup=\""+
	   "document.jsMonthView.prevent(this)\" onkeypress=\"if (!/[0-9]/.test(String.fromCharCode(event.keyCode)))event.keyCode=0\" \onpaste=\"return false\" ondragenter=\"return false\" style=\"ime-mode:disabled\"  onPropertychange=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\"";
	var sButton_Common =  "class=\"mctr_arrow\" onClick=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\" disabled";

	var theName = this.Name;
    var theValue = this.Source.value;
    var objDate = new Date(this.GetTextDate(theValue));
	if (isNaN(objDate)){
	  objDate = new Date();
	}
	var str = "";

	  str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
	  str += "<tr>";
	  str += "<td>";
	  str += "<div class=\"mctr_frameborder\" id=\""+this.Name+"_TimeInput\" onClick=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\" >";
	  str += "<input radix=\"24\" id=\""+this.Name+"_HourInput\" value=\""+this.formatTime(objDate.getHours())+"\" "+sMinute_Common+">:";
	  str += "<input radix=\"60\" id=\""+this.Name+"_MinuteInput\" value=\""+this.formatTime(objDate.getMinutes())+"\" "+sMinute_Common+">:";
	  str += "<input radix=\"60\" id=\""+this.Name+"_SecondInput\" value=\""+this.formatTime(objDate.getSeconds())+"\" "+sMinute_Common+">";
	  str += "</div>";
	  str += "</td>";
	  str += "<td>";
	  str += "<table border=\"0\" cellspacing=\"2\" cellpadding=\"0\">";
	  str += "<tr><td><button id=\""+this.Name+"_TimeInputUp\" "+sButton_Common+">5</button></td></tr>";
	  str += "<tr><td><button id=\""+this.Name+"_TimeInputDown\" "+sButton_Common+">6</button></td></tr>";
	  str += "</table>";
	  str += "</td>";
	  str += "<td>";
	  //str += "<input type=\"Text\" name=\""+forObj+"\" id=\""+forObj+"\" value=\""+this.getNowTime()+"\" style=\"display:''\">"//开发时一般要将此处的style设为display:'none'
	  str += "</td>";
	  str += "</tr>";
	  str += "</table>";
    var theTimeCtrl = document.all.item(theName + "_TimeCtrl");
    theTimeCtrl.innerHTML = str;
  }

  this.CreateTimeNow = function(){
	var theName = this.Name;
    var theStyle = "border:" + this.DayBdWidth + "px solid " + this.TodayBdColor + ";";
	var objDate = new Date();
	var str = "";
	  str += "<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
	  str += "<tr style=\"" + this.FooterStyle + "\">";
	  str += "<td width=\"32\" style=\"" + theStyle + "\">";
	  //str += "&nbsp;现在";
	  theStyle = "border:0px;background-color:FFFFFF;font-size: 12px;width: 28px;height: 14px;";
	  str += "<input type=\"button\" style=\"" + theStyle + "\"id=\"" + theName + "_Now\" onClick=\"document.jsMonthView.UpdateMonthGrid(this,true)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\" value=\"现在\">";
	  str += "</td>";
	  /*
	  class=\"mctr_input\" maxlength=\"2\"
	  
	  str += "<td>";
	  str += "&nbsp;"+this.formatTime(objDate.getHours())+":"
		+this.formatTime(objDate.getMinutes())+":"
		+this.formatTime(objDate.getSeconds());	  
	  str += "</td>";
	  */
	  str += "</table>";
    var theTimeNow = document.all.item(theName + "_TimeNow");
    theTimeNow.innerHTML = str;
  }

  this.Show = function(){
    var theName = this.Name;
    var theDivObject = document.all.item(theName + "_MonthView");
    if (theDivObject == null){ return;}
    theDivObject.style.visibility ="visible";
  }


  //删除对象
  this.DeleteMonthGrid = function( ){ //check document focus, if blur this.Source then delete this
    var theName = this.Name;
    var theDivObject = document.all.item(theName + "_MonthView");
    if (theDivObject == null){
      return;
    }
    var tmpObject = document.activeElement;
    while (tmpObject != null){
      if (tmpObject == this.Source){
	    return;
	  }
      //if (tmpObject.id == theName + "_MonthView"){
      //  return;
      //}
	  //if (tmpObject.id == theName + "_MonthGrid"){
	  //  return;
	  //}
	  if (tmpObject.id == theName + "_goPreviousMonth"){
	    return;
	  }
	  if (tmpObject.id == theName + "_goNextMonth"){
	    return;
	  }
	  if (tmpObject.id == theName + "_YearList"){
	    return;
	  }
	  if (tmpObject.id == theName + "_MonthList"){
	    return;
	  }
	  if (tmpObject.id == theName + "_DayList"){
	    return;
	  }
	  if (tmpObject.id == theName + "_Now"){
	    return;
	  }
	  if (tmpObject.id == theName + "_HourInput"){
	    return;
	  }
	  if (tmpObject.id == theName + "_MinuteInput"){
	    return;
	  }
	  if (tmpObject.id == theName + "_SecondInput"){
	    return;
	  }
	  if (tmpObject.id == theName + "_TimeInputUp"){
	    return;
	  }
	  if (tmpObject.id == theName + "_TimeInputDown"){
	    return;
	  }
	  if (tmpObject.id == theName + "_TimeInput"){
	    return;
	  }
      tmpObject = tmpObject.parentElement;
    }
    if (tmpObject == null){ //delete the month view
      theDivObject.outerHTML = "";
	  var theDate = new Date(this.GetTextDate(this.Source.value));
	  if (isNaN(theDate)){
	    this.Source.value = "";
	  }else{
	    this.Source.value = this.SetDateFormat(theDate.getFullYear(), theDate.getMonth(), theDate.getDate(),theDate.getHours(),theDate.getMinutes(),theDate.getSeconds());
	  }
	  this.Source = null;
    }
  }
  this.InitialMonthView = function( ){
    var theName = this.Name;
    var theValue = this.Source.value;
    var theCurrentDate = new Date(this.GetTextDate(theValue));
	if (isNaN(theCurrentDate)){
	  theCurrentDate = new Date();
	}
    var theDivHTML = "<div  style='visibility:hidden' id=\"" + theName + "_MonthView\" onBlur=\"document.jsMonthView.DeleteMonthGrid();\">";
    theDivHTML += "    <table width=\"" + this.Width.toString() + "\" height=\"" + this.Height.toString() + "\" style=\"" + this.MonthGridStyle + "\" cellpadding=\"0\" cellspacing=\"0\">";
    theDivHTML += "      <tr>";
    theDivHTML += "        <td align=\"center\" valign=\"top\">";
    theDivHTML += "          <table width=\"100%\" height=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
    theDivHTML += "            <tr align=\"center\" style=\"" + this.HeaderStyle + "\">";
    theDivHTML += "              <td>";
    theDivHTML += "                <input type=\"button\" tabIndex=\"-1\" style=\"" + this.MonthBtStyle + "\" id=\"" + theName + "_goPreviousMonth\" value=\"" + this.PreviousMonthText + "\" onClick=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\">";
    theDivHTML += "              </td>";
    theDivHTML += "              <td>";
    theDivHTML += "                <select id=\"" + theName + "_MonthList\">";
    theDivHTML += "                </select>";
    theDivHTML += "              </td>";
    theDivHTML += "              <td>";
    theDivHTML += "                <select id=\"" + theName + "_YearList\">";
    theDivHTML += "                </select>";
    theDivHTML += "                <input type=\"hidden\" id=\"" + theName + "_DayList\" value=\"1\">";
    theDivHTML += "              </td>";
    theDivHTML += "              <td>";
    theDivHTML += "                <input type=\"button\" tabIndex=\"-1\" style=\"" + this.MonthBtStyle + "\" id=\"" + theName + "_goNextMonth\" value=\"" + this.NextMonthText + "\" onClick=\"document.jsMonthView.UpdateMonthGrid(this)\" onBlur=\"document.jsMonthView.DeleteMonthGrid()\">";
    theDivHTML += "              </td>";
    theDivHTML += "            </tr>";
    theDivHTML += "            <tr>";
    theDivHTML += "              <td colspan=\"4\" bgcolor=\"" + this.UnselectBgColor + "\">";
    theDivHTML += "                <div id=\"" + theName + "_MonthGrid\"><br></div>";
    theDivHTML += "              </td>";
    theDivHTML += "            </tr>";
	if (this.hasTime) {
		theDivHTML += "            <tr style=\"" + this.HeaderStyle + "\">";
		theDivHTML += "              <td width=\"44\" >";
		theDivHTML += "                <div id=\"" + theName + "_TimeNow\"><br></div>";
		theDivHTML += "              </td>";
		theDivHTML += "              <td colspan=\"3\" >";
		theDivHTML += "                <div id=\"" + theName + "_TimeCtrl\" ><br></div>";
		theDivHTML += "              </td>";
		theDivHTML += "            </tr>";
	}
    theDivHTML += "          </table>";
    theDivHTML += "        </td>";
    theDivHTML += "      </tr>";
    theDivHTML += "    </table>";
    theDivHTML += "  </div>";
    document.body.insertAdjacentHTML("beforeEnd", theDivHTML);
    theDivObject = document.all.item(theName + "_MonthView");
    theDivObject.style.position = "absolute";
    theDivObject.style.posLeft = this.GetoffsetLeft(this.Source);
    theDivObject.style.posTop = this.GetoffsetTop(this.Source) + this.Source.offsetHeight;
    this.CreateYearList(this.MinYear, this.MaxYear);
    this.CreateMonthList();
    this.CreateMonthGrid(theCurrentDate.getFullYear(), theCurrentDate.getMonth(), theCurrentDate.getDate(),theCurrentDate.getHours(), theCurrentDate.getMinutes(), theCurrentDate.getSeconds());
	if (this.hasTime){
		this.CreateTimeNow();
		this.CreateTimeCtrl();
	}
  }
}
function CreateMonthView(theTextObject,hasTime){ //the month view create interface, fire at element's onFocus event
  if (theTextObject.readOnly == true){
    return;
  }
  if (document.jsMonthView != null){
    if (document.jsMonthView.Source == theTextObject){
	  return;
	}else{
      document.jsMonthView.DeleteMonthGrid();
    }
  }
  document.jsMonthView = new DefineMonthView(theTextObject,hasTime);
  //insert your code, change the month view propertiy
  //example:
  //  document.jsMonthView.DateFormat = "<MMM> <d>,<yyyy>";
  document.jsMonthView.InitialMonthView();
  theTextObject.select();
  document.jsMonthView.Show();
}
function DeleteMonthView(theTextObject){ //the month view delete interface, fire at element's onBlur event
  if (document.jsMonthView == null){
    return;
  }
  document.jsMonthView.DeleteMonthGrid();
  if (document.jsMonthView.Source == null){
    document.jsMonthView = null;
  }
}
</script>