dtpicker.htc

HTC,demo WEB用于。 超大型

		if(vEleClient <= vListHeight) vListTop += vListHeight -vEleClient;
	}
	vEleClient = vElementLeft - element.document.body.scrollLeft;
	vDocClient = element.document.body.clientWidth;
	if(vDocClient - vEleClient < vListWidth) vListLeft -= vListWidth - (vDocClient - vEleClient)
	objList.style.pixelTop = vListTop;
//	objList.style.left = vListLeft;
  objList.style.left = objText.offsetWidth;

}

var vMaxDate,vMinDate,vDatePart;
var vKeyInput;

function selectRange(){ //鼠标选择objInput中的日期

		validateKeyInput();

  if(vReadOnly == "true"){//如果只读
    objRange = null;
    objInput.blur();
    
  }
  objRange = null;
	objRange = element.document.selection.createRange();
	objRange.expand("word");
  if(objRange.text==""){//如果没有选中文字
    objInput.blur();
  };
	switch(objRange.text.replace(/\s/g,"")){
	case "年":
	case "月":
	case "日":
		objRange.move("character",-1);
		objRange.expand("word");
		break;
	case "":
		objRange.move("word",-2);
		objRange.expand("word");
		break;
	}
	if(objRange.text.replace(/\d/g,"") == ""){
		getDatePart();
		objRange.select();
	}
	else{
		objRange.move("textedit",1);
		objRange.select();
		objRange = null;
	}
}

function turnDate(){ //翻动objRange中的日期值
	var vRangeText;
  
  if(window.event.keyCode == 27){//如果是按下ESC键
    setDateNull();//恢复默认值
    objInput.value = text;
    return ;
  }

	if(!objRange || objRange.text == "") return;
  if(tagOnKey != objRange){//如果焦点还没有转化
    if(tagOnKey != null){
      validateKeyInput();
    }else {
      OldvDatePart = vDatePart;//保存当前的类型
      tagOnKey = objRange;//保存当前的操作段
    }
  }//end if(tagOnKey!= objange)
	switch(window.event.keyCode){
	case 37:  //左箭头
		validateKeyInput();
    if(vDatePart!='year'){//如果是年,则不能再往左走
      vRangeText = objRange.text;
      objRange.move("character",-2)
      objRange.expand("word");
      if(objRange.text == vRangeText){
        objRange.move("textedit",1);
        objRange.move("character",-4);
        objRange.expand("word");
      }
      getDatePart();
      objRange.select();
    }
		break;
	case 39:  //右箭头
		validateKeyInput(); //如果有用户键盘输入，则马上计算
    if(vDatePart!='date'){//如果是日期,则不能再往右走
      objRange.move("word",2)
      objRange.expand("word");
      if(objRange.text == ""){
        objRange.move("word",-6);
        objRange.expand("word");
      }
      getDatePart(); //得到textRange环境
      objRange.select();
    }
		break;
	case 38:  //上箭头
		vRangeText = parseInt(objRange.text) + 1;
		if(vRangeText > vMaxDate) vRangeText = vMinDate;
		dateUpDown(vRangeText);
		break;
	case 40:  //下箭头
		vRangeText = parseInt(objRange.text) - 1;
		if(vRangeText < vMinDate) vRangeText = vMaxDate;
		dateUpDown(vRangeText);
		break;
	case 48:
	case 96:  //0 - 9
		keyInput(0);
		break;
	case 49:
	case 97:
		keyInput(1);
		break;
	case 50:
	case 98:
		keyInput(2);
		break;
	case 51:
	case 99:
		keyInput(3);
		break;
	case 52:
	case 100:
		keyInput(4);
		break;
	case 53:
	case 101:
		keyInput(5);
		break;
	case 54:
	case 102:
		keyInput(6);
		break;
	case 55:
	case 103:
		keyInput(7);
		break;
	case 56:
	case 104:
		keyInput(8);
		break;
	case 57:
	case 105:
		keyInput(9);
		break;
	}
	window.event.returnValue = false;
}

function getDatePart(){ //确定objRange的环境(极值和所属部分)
	if(!objRange) return;
	objRange.moveEnd("word",1);
	switch(objRange.text.replace(/\d/g,"")){
	case "年":
		vMaxDate = 9999;
		vMinDate = 1601;
		vDatePart = "year";
		break;
	case "月":
		vMaxDate = 12;
		vMinDate = 1;
		vDatePart = "month";
		break;
	case "日":
		vMaxDate = getTotalDates(month);
		vMinDate = 1;
		vDatePart = "date";
		break;
	}
	objRange.moveEnd("word",-1);
  tagOnKey = null;
}

function dateUpDown(argValue){ //在objRange中按上下方向键
	var objDateRange,vMaxDate;
	objRange.text = argValue;
	objRange.move("character",-1);
	objRange.expand("word");
	objRange.select();
	eval(vDatePart + "=" + argValue);
	validateDate(); //验证日
}

function validateDate(){ //如果改变年月导致日错误则改变日
	var vMaxDate = getTotalDates(month);
	if(date > vMaxDate){
		objDateRange = objInput.createTextRange();
		objDateRange.move("textedit",1);
		objDateRange.move("word",-2);
		objDateRange.expand("word");
		objDateRange.text = vMaxDate;
		date = vMaxDate;
	}
}

function keyInput(argKey){ //键盘输入日期
	if(!objRange) return;
  switch(vDatePart){
	case "year":
		if(!vKeyInput) vKeyInput = "0000";
		break;
	case "month":
	case "date":
		if(!vKeyInput) vKeyInput = "00";
		break;
	default:
		return;
	}
	if(vKeyInput.indexOf("0") == 0){
		window.clearTimeout(vTimeout2);
		vKeyInput = vKeyInput.substr(1) + argKey;
    objRange.text = vKeyInput;
    objRange.moveStart("word", -1);
		objRange.expand("word");
    objRange.select();
		vTimeout2 = window.setTimeout(validateKeyInput,1000);
	}
}

function validateKeyInput(){ //验证用户键盘输入日期
	var vTemp;
  var tmpRange,tmpvDataPart;//保存中间段位信息
  if(tagOnKey!= null){
    tmpRange = objRange;//取出原来的段
    objRange = tagOnKey;
    tmpvDatePart = vDatePart;
    vDatePart = OldvDatePart;
  }
	if(!objRange || !vKeyInput) return;
	window.clearTimeout(vTimeout2);

	switch(vDatePart){
	case "year":
		vTemp = parseInt(vKeyInput,10);
		if(vTemp >= 0 && vTemp < 10){
			year = parseInt("200" + vTemp);
			validateDate();
		}
		else if(vTemp >= 10 && vTemp < 50){
			year = parseInt("20" + vTemp);
			validateDate();
		}
		else if(vTemp >=50 && vTemp <= 99){
			year = parseInt("19" + vTemp);
			validateDate();
		}
		else if(vTemp >= 1601 && vTemp <=9999){
			year = vTemp;
			validateDate();
		}
		objRange.text = year;
		break;
	case "month":
		vTemp = parseInt(vKeyInput,10);
		if(vTemp <= 12 && vTemp >= 1){
			month = vTemp;
			validateDate();
		}
		objRange.text = month;
		break;
	case "date":
		vTemp = parseInt(vKeyInput,10);
		if(vTemp <= getTotalDates(month) && vTemp >= 1){
			date = vTemp;
		}
		objRange.text = date;
	}
  
  objRange.move("character",-1);
	objRange.expand("word");
//  objRange.select();
  //恢复原来的段信息
  if(tmpRange){
    objRange = tmpRange;
    vDatePart = tmpvDatePart;
  }
  objRange.select();
	vKeyInput = null;
  tagOnKey = null;//重新更新的标志位

  setInputVisibility();
}

function setDate(argDate){
/*  var vDate = argDate;
  if(argDate != null){
    year = vDate.getFullYear();
    month = vDate.getMonth() + 1;
    date = vDate.getDate();
  }else{
    year = "1900";
    month = "01";
    date = "01";
  }
 */

  var vDate = (argDate)?argDate:(new Date());
	year = vDate.getFullYear();
	month = vDate.getMonth() + 1;
	date = vDate.getDate();

  setInputVisibility();
}
function setDateNull(){//处理01-1月 -00年
  year = "1900";
  month = "1";
  date = "01";
  setInputVisibility();
}

function getTotalDates(vMonth){ //return some month's max date
	var arrTotalDates = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
	if(vMonth == 2 && year % 4 == 0){
		if(year % 100 == 0 && year % 400 != 0) return(28);
		return(29);
	}
	return(arrTotalDates[vMonth - 1]);
}

function changeYear(){ //年改变时objList的外观变化
	objYearBox.innerText = year;
	fillDates();
	objInput.value = text;
}

function changeDate(){ //月日改变时objList的外观变化
	var arrMonths = new Array("一月", "二月", "三月", "四月", "五月",	"六月", "七月", "八月", "九月", "十月", "十一月", "十二月");

	if(month == 0){
		month = 12;
		year -= 1;
	}
	else if(month == 13){
		month = 1;
		year += 1;
	}
	objMonthBox.innerText = arrMonths[month - 1];
	changeYear();
}

function stopLoop(){ //停止连续翻动日历
	window.clearTimeout(vTimeout2);
}

function stopLoop2(){ //停止翻动和渐变
	stopLoop();
	window.clearTimeout(vTimeout);
	objLight = window.event.srcElement;
}

function overBtn(){ //移动到objBtn上的样式
	var objBtnBg = objBtn.children(0); //表现按钮背景的<v:roundrect>
	objBtnBg.fillcolor = "#BDE3FF";
	objBtnBg.fill.color2 = "#E7F3FF";
}

function outBtn(){ //objBtn复原为原有样式
	var objBtnBg;

	if(objList && objList.style.display != "none") overBtn(); //如果calendar开着就变成over btn样式
	else{
		objBtnBg = objBtn.children(0); //表现按钮背景的<v:roundrect>
		objBtnBg.fillcolor = "#B5CFFF";
		objBtnBg.fill.color2 = "#DEE3FF";
	}
}

function downBtn(){ //objBtn按下后的样式
	var objBtnBg = objBtn.children(0); //表现按钮背景的<v:roundrect>
	objBtnBg.fillcolor = "#9CB2F7";
	objBtnBg.fill.color2 = "#6B8EF7";
}

function noResponse(){
	window.event.cancelBubble = true;
	window.event.returnValue = false;
}

function refresh(){ // 刷新
	var objTemp;

  objText.innerText = caption;//调协Caption

	with(element){
		style.width = parseInt(width)+parseInt(objText.offsetWidth);
		style.pixelHeight = height;
		style.top = top;
		style.left = left;
    style.border = "0px";
	}
  with(objDIVBorder){//设置边框
    style.pixelWidth =parseInt(width);// parseInt(width);
		style.pixelHeight = height - 1;
    style.left = objText.offsetWidth -1;
    style.border = "1px solid #7B9EBD";
  }
	if(width > 18) objInput.style.pixelWidth = width - 20;
	else{
		objInput.style.pixelWidth = width - 8;
		objBtn.style.pixelWidth = 6;
	}
	objBtn.style.pixelHeight = Math.min(height - 4,16);
	objBtn.style.left = objInput.style.pixelWidth+1;

	objInput.style.fontSize = (height < 15)?"8pt":"9pt";
	objInput.style.pixelHeight =(height < 17)?(height - 2):(height - 3);
	objInput.style.marginTop = (height < 17)?0:1;

  setInputVisibility();
  objInput.style.left = objText.offsetWidth;


	if(value.indexOf("null") != -1) value = null; //输入空值
	objInput.value = text;
	//for locating the list box
	objTemp = element;
	vElementTop = 0;
	vElementLeft = 0;
	while(objTemp != null){
		vElementTop += objTemp.offsetTop;
		vElementLeft += objTemp.offsetLeft;
		objTemp = objTemp.offsetParent;
	}
  setBtn();
  
}

function initialize(){
  //全局变量赋值
	
  vClickNum = false;
	vListHeight = 155;
	vListWidth = 150;
  
  objDIVBorder = element.document.createElement("<div style='position:absolute;top:-1px;z-index:2'></div>");
  objDIVBorder = element.appendChild(objDIVBorder);

	//create dropdown button (btn)
	element.insertAdjacentHTML("afterBegin","<v:group style='top:1px;right:1px;position:absolute;width:14px; height:16px;z-index:3;' coordsize='14,16'><v:roundrect arcsize='0.1' style='width:14;height:14;' fillcolor='#B5CFFF' strokecolor='#ADC3F7'><v:fill type='gradientradial' color2='#DEE3FF' angle='75'/></v:roundrect><v:polyline style='position:absolute;top:6; left:4' points='-1,0 3,3 7,0' strokecolor='#4A6184' strokeweight='2px' filled='false'/><v:oval id=test style=\"width: 10; height: 10;left:2;top:2;\"><v:stroke weight=\"1px\" color=\"#4A6184\"/></v:oval><v:polyline style='position:absolute;top:6; left:4' points='0,-1 3,2 6,0' strokecolor='#0066FF' strokeweight='1px' filled='false'/></v:group><xml:namespace ns='schemas-microsoft-com:VML' prefix='v'/>");
	objBtn = element.children(0);
  objBtn = objDIVBorder.appendChild(objBtn);
  if(vReadOnly=='false' || vReadOnly==false)
    with(objBtn){
      onmousedown = clickBtn;
      onmouseup = overBtn;
      onmouseover = overBtn;
      onmouseout = outBtn;
    }
  
	//create input box
	objInput = element.document.createElement("<input class='sc_dt_input'/>");
	objInput = element.appendChild(objInput);
  
	objText = element.document.createElement("<span style='position:absolute;top:3'></apan>");
	objText = element.appendChild(objText);

	with(objInput){
		onmouseover = overBtn;
		onmouseout = outBtn;
		onmousedown = hideCalendar3;
		onmouseup = selectRange;
		ondblclick = noResponse;
		onkeydown = turnDate;
		onfocus = focusInput;
		onblur = blurInput;
	}
  

	refresh();
  putReadOnly("false");
	element.style.visibility = "visible";
}

function setBtn(){//设置按钮
  var objBtnStyle1 = objBtn.children(0);
  var objBtnStyle2 = objBtn.children(1);
  var objBtnStyle3 = objBtn.children(2);
  var objBtnStyle4 = objBtn.children(3);

  if(vReadOnly==false||vReadOnly=='false'){
    objBtnStyle1.strokecolor = "#ADC3F7";
    objBtnStyle1.fillcolor = "#B5CFFF";
    objBtnStyle1.fill.color2 ="#DEE3FF";
    objBtnStyle2.strokecolor = "#4A6184";
    objBtnStyle3.strokecolor="#4A6184";
    objBtnStyle4.strokecolor="#009933";
  }else{
    objBtnStyle1.strokecolor = "#999999";
    objBtnStyle1.fillcolor = "#F0F0F0";
    objBtnStyle1.fill.color2 ="#cccccc";
    objBtnStyle2.strokecolor = "#AAAAAA";
    objBtnStyle3.strokecolor="#cccccc";
    objBtnStyle4.strokecolor="#cccccc";
  }    
}

function setInputVisibility(){//设备objInput是否隐藏
  if(objInput){
  if(year=='1900' && parseInt(month)==1 && parseInt(date)==1){
    objInput.style.visibility = 'hidden';
  }else
    objInput.style.visibility = 'visible';
}
}
//-->
</script>
</public:component>