/*셀렉트박스 설정*/
var nowOpenedSelectBox = "";
var mousePosition = "";

function selectThisValue(thisId,thisIndex,thisValue,thisString) {
	var objId = thisId;
	var nowIndex = thisIndex;
	var valueString = thisString;
	var sourceObj = document.getElementById(objId);
	var nowSelectedValue = document.getElementById(objId+"SelectBoxOptionValue"+nowIndex).value;
	hideOptionLayer(objId);
	if (sourceObj) sourceObj.value = nowSelectedValue;
	settingValue(objId,valueString);
	selectBoxFocus(objId);
	if (sourceObj.onchange) sourceObj.onchange();
}

function selectThisValue_5(thisId,thisIndex,thisValue,thisString) {
	var objId = thisId;
	var nowIndex = thisIndex;
	var valueString = thisString;
	var sourceObj = document.getElementById(objId);
	var nowSelectedValue = document.getElementById(objId+"SelectBoxOptionValue"+nowIndex).value;
	hideOptionLayer(objId);
	if (sourceObj) sourceObj.value = nowSelectedValue;
	settingValue(objId,valueString);
	selectBoxFocus_5(objId);
	if (sourceObj.onchange) sourceObj.onchange();
}

function settingValue(thisId,thisString) {
	var objId = thisId;
	var valueString = thisString;
	var selectedArea = document.getElementById(objId+"selectBoxSelectedValue");
	if (selectedArea) selectedArea.innerHTML = valueString.replace("&","&amp;");
}

function viewOptionLayer(thisId) {
	var objId = thisId;
	var optionLayer = document.getElementById(objId+"selectBoxOptionLayer");
	if (optionLayer) optionLayer.style.display = "";
	nowOpenedSelectBox = objId;
	setMousePosition("inBox");
}

function hideOptionLayer(thisId) {
	var objId = thisId;
	var optionLayer = document.getElementById(objId+"selectBoxOptionLayer");
	if (optionLayer) optionLayer.style.display = "none";
}

function setMousePosition(thisValue) {
	var positionValue = thisValue;
	mousePosition = positionValue;
}

function clickMouse() {
	if (mousePosition == "out") hideOptionLayer(nowOpenedSelectBox);
}

function selectBoxFocus(thisId) {
	var objId = thisId;
	var obj = document.getElementById(objId + "selectBoxSelectedValue");
	obj.className = "selectBoxSelectedAreaFocus";
	obj.focus();
}

function selectBoxFocus_5(thisId) {
	var objId = thisId;
	var obj = document.getElementById(objId + "selectBoxSelectedValue");
	obj.className = "selectBoxSelectedAreaFocus_5";
	obj.focus();
}

function selectBoxBlur(thisId) {
	var objId = thisId;
	var obj = document.getElementById(objId + "selectBoxSelectedValue");
	obj.className = "selectBoxSelectedArea";
}

function NullCheck ( obj , msg )
{
	if ( obj.value == "" )
	{
		alert ( msg + "입력하세요" );
		obj.focus();
		//obj.select();
		return true;
	}
	return false;
}

function selectBoxOptionRf(thisId) {
	var optionHeight = 17; // option 하나의 높이
	var optionMaxNum = 5; // 한번에 보여지는 option의 갯수
	var objId = thisId;
	var obj = document.getElementById(objId);
	var trgObj = document.getElementById(objId+"SelectBoxOptionArea");
	var newOption = "";
	
	newOption += "		<table cellpadding='0' cellspacing='0' border='0' width='100%' style='table-layout:fixed;word-break:break-all;'>";
	for (var i=0 ; i < obj.options.length ; i++) {
		var nowValue = obj.options[i].value;
		var nowText = obj.options[i].text;
		newOption += "			<tr>";
		newOption += "				<td height='" + optionHeight + "' class='selectBoxOption' onMouseOver=\"this.className='selectBoxOptionOver'\" onMouseOut=\"this.className='selectBoxOption'\" onClick=\"selectThisValue('"+ objId + "'," + i + ",'" + nowValue + "','" + nowText + "')\" style='cursor:hand;'>" + nowText + "</td>";
		newOption += "				<input type='hidden' id='"+ objId + "SelectBoxOptionValue" + i + "' value='" + nowValue + "'>";
		newOption += "			</tr>";
	}
	newOption += "		</table>";
	
	if(trgObj) {
		if (obj.options.length > optionMaxNum) trgObj.style.height = (optionHeight * optionMaxNum) + "px";
		else trgObj.style.height = (optionHeight * obj.options.length) + "px";
		trgObj.innerHTML = newOption;
		var haveSelectedValue = false;
		for (var i=0 ; i < obj.options.length ; i++) {
			if (obj.options[i].selected == true) {
				haveSelectedValue = true;
				settingValue(objId,obj.options[i].text);
			}
		}
		if (!haveSelectedValue) settingValue(objId,obj.options[0].text);
	}
}







<!--   셀렉트 박스 1번   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->

function makeSelectBox_1(thisId, divTarget) {
	var downArrowSrc = "images/arrow_mt_seleca.gif";	//오른쪽 화살표이미지
	var downArrowSrcWidth = 16;	//오른쪽 화살표이미지 width
	var optionHeight = 18; // option 하나의 높이
	var optionMaxNum = 20; // 한번에 보여지는 option의 갯수
	var optionInnerLayerHeight = "";
	var objId = thisId;
	var obj = document.getElementById(objId);
	var selectBoxWidth = parseInt(obj.style.width);
	var selectBoxHeight = parseInt(obj.style.height);
	if (obj.options.length > optionMaxNum) optionInnerLayerHeight = "height:"+ (optionHeight * optionMaxNum) + "px";
	newSelect  = "<table id='" + objId + "selectBoxOptionLayer' cellpadding='0' cellspacing='0' border='0' style='position:absolute;z-index:100;display:none;' onMouseOver=\"viewOptionLayer('"+ objId + "')\" onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td height='" + (selectBoxHeight - 1) + "' style='cursor:hand;' onClick=\"hideOptionLayer('"+ objId + "')\"></td>"; 	// 하단 열리는 박스 위치
	newSelect += "	</tr>";
	newSelect += "	<tr>";
	// 스크롤바 스타일
	newSelect += "		<td bgcolor='#ffffff' class='sco2' style='padding:0px 0px 0px 0px; border-collapse:collapse; BORDER: #D7D7D7 1px solid;'>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>";//옵션 박스 상단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	// 하단 열리는 박스 넓이
	newSelect += "		<div class='selectBoxOptionInnerLayer' style='width:" + (selectBoxWidth-1) + "px;" + optionInnerLayerHeight + "'>";
	//하단 옵션 박스 넓이
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'style='table-layout:fixed;word-break:break-all;'>";
	for (var i=0 ; i < obj.options.length ; i++) {
		var nowValue = obj.options[i].value;
		var nowText = obj.options[i].text;
		if (typeof(obj.options[i].separator) == "undefined") {
			newSelect += "			<tr>";
			// 마우스 오버 효과
			newSelect += "				<td height='" + optionHeight + "' class='selectBoxOption' onMouseOver=\"this.className='selectBoxOptionOver'\" onMouseOut=\"this.className='selectBoxOption'\" onClick=\"selectThisValue('"+ objId + "'," + i + ",'" + nowValue + "','" + nowText + "')\" style='cursor:hand;padding-left:5px;'>" + nowText + "</td>";
			newSelect += "				<input type='hidden' id='"+ objId + "SelectBoxOptionValue" + i + "' value='" + nowValue + "'>";
			newSelect += "			</tr>";
		} else
		{

		}
	}
	newSelect += "		</table>";
	newSelect += "		</div>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0' width='100%'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>"; //옵션 박스 하단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	// 셀렉스 박스 테두이 선 색, 두께
	newSelect += "<table cellpadding='0' cellspacing='1' border='0' bgcolor='#D7D7D7' onClick=\"viewOptionLayer('"+ objId + "')\" style='cursor:hand;' onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td bgcolor='FFFFFF' style='padding:1px 1px 1px 0px'>"; //상단  셀렉트 박스 스타일
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td><div id='" + objId + "selectBoxSelectedValue' class='selectBoxSelectedArea' style='width:" + (selectBoxWidth - downArrowSrcWidth - 2) + "px;height:" + (selectBoxHeight - 3) + "px;overflow:hidden;' onBlur=\"selectBoxBlur('" + objId + "')\"></div></td>";
	newSelect += "				<td><img src='" + downArrowSrc + "' width='" + downArrowSrcWidth + "' border='0'></td>";
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	if(divTarget) divTarget.innerHTML = newSelect;
	else document.write(newSelect);
	
	var haveSelectedValue = false;
	for (var i=0 ; i < obj.options.length ; i++) {
		if (obj.options[i].selected == true) {
			haveSelectedValue = true;
			settingValue(objId,obj.options[i].text);
		}
	}
	if (!haveSelectedValue) settingValue(objId,obj.options[0].text);
}







<!--   셀렉트 박스 2번   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->

function makeSelectBox_2(thisId, divTarget) {
	var downArrowSrc = "images/arrow_mt_selecb.gif";	//오른쪽 화살표이미지
	var downArrowSrcWidth = 15;	//오른쪽 화살표이미지 width
	var optionHeight = 18; // option 하나의 높이
	var optionMaxNum = 20; // 한번에 보여지는 option의 갯수
	var optionInnerLayerHeight = "";
	var objId = thisId;
	var obj = document.getElementById(objId);
	var selectBoxWidth = parseInt(obj.style.width);
	var selectBoxHeight = parseInt(obj.style.height);
	if (obj.options.length > optionMaxNum) optionInnerLayerHeight = "height:"+ (optionHeight * optionMaxNum) + "px";
	newSelect  = "<table id='" + objId + "selectBoxOptionLayer' cellpadding='0' cellspacing='0' border='0' style='position:absolute;z-index:100;display:none;' onMouseOver=\"viewOptionLayer('"+ objId + "')\" onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td height='" + (selectBoxHeight - 1) + "' style='cursor:hand;' onClick=\"hideOptionLayer('"+ objId + "')\"></td>"; 	// 하단 열리는 박스 위치
	newSelect += "	</tr>";
	newSelect += "	<tr>";
	// 스크롤바 스타일
	newSelect += "		<td bgcolor='#ffffff' class='sco2' style='padding:0px 0px 0px 0px; border-collapse:collapse; BORDER: #D7D7D7 1px solid;'>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>";//옵션 박스 상단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	// 하단 열리는 박스 넓이
	newSelect += "		<div class='selectBoxOptionInnerLayer' style='width:" + (selectBoxWidth-1) + "px;" + optionInnerLayerHeight + "'>";
	//하단 옵션 박스 넓이
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'style='table-layout:fixed;word-break:break-all;'>";
	for (var i=0 ; i < obj.options.length ; i++) {
		var nowValue = obj.options[i].value;
		var nowText = obj.options[i].text;
		if (typeof(obj.options[i].separator) == "undefined") {
			newSelect += "			<tr>";
			// 마우스 오버 효과
			newSelect += "				<td height='" + optionHeight + "' class='selectBoxOption' onMouseOver=\"this.className='selectBoxOptionOver'\" onMouseOut=\"this.className='selectBoxOption'\" onClick=\"selectThisValue('"+ objId + "'," + i + ",'" + nowValue + "','" + nowText + "')\" style='cursor:hand;padding-left:5px;'>" + nowText + "</td>";
			newSelect += "				<input type='hidden' id='"+ objId + "SelectBoxOptionValue" + i + "' value='" + nowValue + "'>";
			newSelect += "			</tr>";
		} else
		{

		}
	}
	newSelect += "		</table>";
	newSelect += "		</div>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0' width='100%'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>"; //옵션 박스 하단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	// 셀렉스 박스 테두이 선 색, 두께
	newSelect += "<table cellpadding='0' cellspacing='1' border='0' bgcolor='#D7D7D7' onClick=\"viewOptionLayer('"+ objId + "')\" style='cursor:hand;' onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td bgcolor='FFFFFF' style='padding:1px 1px 1px 0px'>"; //상단  셀렉트 박스 스타일
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td><div id='" + objId + "selectBoxSelectedValue' class='selectBoxSelectedArea' style='width:" + (selectBoxWidth - downArrowSrcWidth - 2) + "px;height:" + (selectBoxHeight - 3) + "px;overflow:hidden;' onBlur=\"selectBoxBlur('" + objId + "')\"></div></td>";
	newSelect += "				<td><img src='" + downArrowSrc + "' width='" + downArrowSrcWidth + "' border='0'></td>";
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	if(divTarget) divTarget.innerHTML = newSelect;
	else document.write(newSelect);
	
	var haveSelectedValue = false;
	for (var i=0 ; i < obj.options.length ; i++) {
		if (obj.options[i].selected == true) {

			haveSelectedValue = true;
			settingValue(objId,obj.options[i].text);
		}
	}
	if (!haveSelectedValue) settingValue(objId,obj.options[0].text);
}







<!--   셀렉트 박스 3번   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->

function makeSelectBox_3(thisId, divTarget) {
	var downArrowSrc = "images/arrow_mt_selec.gif";	//오른쪽 화살표이미지
	var downArrowSrcWidth = 15;	//오른쪽 화살표이미지 width
	var optionHeight = 18; // option 하나의 높이
	var optionMaxNum = 20; // 한번에 보여지는 option의 갯수
	var optionInnerLayerHeight = "";
	var objId = thisId;
	var obj = document.getElementById(objId);
	var selectBoxWidth = parseInt(obj.style.width);
	var selectBoxHeight = parseInt(obj.style.height);
	if (obj.options.length > optionMaxNum) optionInnerLayerHeight = "height:"+ (optionHeight * optionMaxNum) + "px";
	newSelect  = "<table id='" + objId + "selectBoxOptionLayer' cellpadding='0' cellspacing='0' border='0' style='position:absolute;z-index:100;display:none;' onMouseOver=\"viewOptionLayer('"+ objId + "')\" onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td height='" + (selectBoxHeight - 1) + "' style='cursor:hand;' onClick=\"hideOptionLayer('"+ objId + "')\"></td>"; 	// 하단 열리는 박스 위치
	newSelect += "	</tr>";
	newSelect += "	<tr>";
	// 스크롤바 스타일
	newSelect += "		<td bgcolor='#ffffff' class='sco2' style='padding:0px 0px 0px 0px; border-collapse:collapse; BORDER: #D7D7D7 1px solid;'>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>";//옵션 박스 상단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	// 하단 열리는 박스 넓이
	newSelect += "		<div class='selectBoxOptionInnerLayer' style='width:" + (selectBoxWidth+0) + "px;" + optionInnerLayerHeight + "'>";
	//하단 옵션 박스 넓이
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'style='table-layout:fixed;word-break:break-all;'>";
	for (var i=0 ; i < obj.options.length ; i++) {
		var nowValue = obj.options[i].value;
		var nowText = obj.options[i].text;
		if (typeof(obj.options[i].separator) == "undefined") {
			newSelect += "			<tr>";
			// 마우스 오버 효과
			newSelect += "				<td height='" + optionHeight + "' class='selectBoxOption' onMouseOver=\"this.className='selectBoxOptionOver'\" onMouseOut=\"this.className='selectBoxOption'\" onClick=\"selectThisValue('"+ objId + "'," + i + ",'" + nowValue + "','" + nowText + "')\" style='cursor:hand;padding-left:5px;'>" + nowText + "</td>";
			newSelect += "				<input type='hidden' id='"+ objId + "SelectBoxOptionValue" + i + "' value='" + nowValue + "'>";
			newSelect += "			</tr>";
		} else
		{

		}
	}
	newSelect += "		</table>";
	newSelect += "		</div>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0' width='100%'>";
	newSelect += "			<tr>";
	newSelect += "				<td height='1' bgcolor='FFFFFF'></td>"; //옵션 박스 하단 추가
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	// 셀렉스 박스 테두이 선 색, 두께
	newSelect += "<table cellpadding='0' cellspacing='1' border='0' bgcolor='#D7D7D7' onClick=\"viewOptionLayer('"+ objId + "')\" style='cursor:hand;' onMouseOut=\"setMousePosition('out')\">";
	newSelect += "	<tr>";
	newSelect += "		<td bgcolor='FFFFFF' style='padding:0px 2px 1px 0px'>"; //상단  셀렉트 박스 스타일
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0'>";
	newSelect += "			<tr>";
	newSelect += "				<td><div id='" + objId + "selectBoxSelectedValue' class='selectBoxSelectedArea2' style='width:" + (selectBoxWidth - downArrowSrcWidth - 2) + "px;height:" + (selectBoxHeight - 3) + "px;overflow:hidden;' onBlur=\"selectBoxBlur('" + objId + "')\"></div></td>";
	newSelect += "				<td><img src='" + downArrowSrc + "' width='" + downArrowSrcWidth + "' border='0'></td>";
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	if(divTarget) divTarget.innerHTML = newSelect;
	else document.write(newSelect);
	
	var haveSelectedValue = false;
	for (var i=0 ; i < obj.options.length ; i++) {
		if (obj.options[i].selected == true) {
			haveSelectedValue = true;
			settingValue(objId,obj.options[i].text);
		}
	}
	if (!haveSelectedValue) settingValue(objId,obj.options[0].text);
}














document.onmousedown = clickMouse;


<!-- 이미지 링크시 점선 테두리 삭제 스크립트 -->
function bluring(){  
if(event.srcElement.tagName=="A"||event.srcElement.tagName=="img") document.body.focus(); 
} 
document.onfocusin=bluring;


