JSタイムセレクタ

<!--
	
	function timeShow(obj) {
		var isShow = true;
		var isFirst = true;
		var div = document.getElementById('div_' + obj.id);
		var hourSelect = document.getElementById('hourSelect_' + obj.id);
		var minSelect = document.getElementById('minSelect_' + obj.id);
		var timeTable = document.getElementById('timeTable_' + obj.id);
		var st_time;
		
		//         
		var time = obj.value;
		
		var hour;
		var minute;

		var tableString = "<table id='timeTable_" + obj.id + "' border=0 width='200px'><tr><td> :</td><td></td><td> :</td><td></td></tr><tr align='center'><td colspan='4'><input id='st_" + obj.id + "' type='button' value='  '></td></tr></table>";
		
		if (time != "") {
				hour = time.split(":")[0];
				minute = time.split(":")[1];
			}
		if (isShow)
		{
			isShow = false;
			
			if (isFirst)
			{
				isFirst = false;
	
				if (div == null || div == undefined)
				{
					div = document.createElement('div');
					hourSelect = document.createElement('select');
					minSelect = document.createElement('select');
					timeTable = document.createElement('table');
					
					div.setAttribute('id','div_' + obj.id);
					hourSelect.setAttribute('id','hourSelect_' + obj.id);
					minSelect.setAttribute('id','minSelect_' + obj.id);

					for (var i=0;i<24 ;i++ )
					{
						if (i < 10)
						{
							hourSelect.options.add(new Option('0'+i,'0'+i));
						}
						else {
							hourSelect.options.add(new Option(i,i));
						}
					}

					for (var i=0;i<60 ;i++ )
					{
						if (i < 10)
						{
							
							minSelect.options.add(new Option('0'+i,'0'+i));
						}
						else {
							
							minSelect.options.add(new Option(i,i));
						}
					}

					div.innerHTML = tableString;

					// set styles
					hourSelect.style.width = '60px';
					
					minSelect.style.width = '60px';
					
					div.style.zIndex = '100';
					div.style.position = 'absolute';
					div.style.border = '1px solid blue';
					div.style.backgroundColor = '#6666FF';
					div.style.width = '80px';
					div.style.height = '50px';
					div.style.left = event.x;
					div.style.top = event.y;
					div.style.display = 'block';
					
					document.body.appendChild(div);

					var timeTable = document.getElementById('timeTable_' + obj.id);
					var hourTd = timeTable.rows[0].cells[1];
					hourTd.appendChild(hourSelect);
					var hourTd = timeTable.rows[0].cells[3];
					hourTd.appendChild(minSelect);
					
					st_time = document.getElementById('st_' + obj.id);
					
					st_time.onclick = function() {
						obj.value = hourSelect.options[hourSelect.selectedIndex].text + ':' + minSelect.options[minSelect.selectedIndex].text;
						div.style.display = 'none';
						isShow = true;
					}
					
					
					if (hour != "") {
							for (var i=0;i<hourSelect.options.length;i++) {
									if (hourSelect.options[i].text == hour) {
											hourSelect.options[i].selected = true;
										}
								}
						}
						
						if (minute != "") {
							for (var i=0;i<minSelect.options.length;i++) {
									if (minSelect.options[i].text == minute) {
											minSelect.options[i].selected = true;
										}
								}
						}
				}
				else {
					div.style.display = 'block';
				}
				
			}
			else {
				div.style.display = 'block';
			}

		}
	}
	function TimePicker(obj) {
			timeShow(obj);
	}
//-->




	 
	
	
	-----------------------------------------------------------------------------------------------