멀티 콤보리스트 샘플1 - bami74/me GitHub Wiki

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

 <head>

<script>

function multiSelect(value){

  if(value=="OPEN") Div.style.visibility="visible";

  else Div.style.visibility="hidden";

}

</script>

<style type="text/css">

   select, ul { height: 100px; overflow: auto; width: 200px; border: 1px solid #000; }

   ul { list-style-type: none; margin: 0; padding: 0; overflow-x: hidden; }

   li { margin: 0; padding: 0; }

   label { display: block; color: WindowText; background-color: Window; margin: 0; padding: 0; width: 100%; }

   label:hover { background-color: Highlight; color: HighlightText; }

  </style>

</head>

<body>

<form name="form1">

  <table cellpadding="0" cellspacing="0" style="cursor:pointer" onClick="multiSelect('OPEN')">

  <tr>

   <td align="center" width="200" style="border:1px solid;font-size:12px;">다중선택 리스트</td>

   <td><input type="button" value="▼" onclick=""></td>

  </tr>

  </table>

  <div id="Div" style="position:absolute;visibility:hidden;font-size:12px;">

   <ul>

     <li><input type="checkbox" name="chk1" id="chk1">체크리스트1</li>

     <li><input type="checkbox" name="chk2" id="chk2">체크리스트2</li>

     <li><input type="checkbox" name="chk3" id="chk3">체크리스트3</li>

     <li><input type="checkbox" name="chk4" id="chk4">체크리스트4</li>

     <li><input type="checkbox" name="chk5" id="chk5">체크리스트5</li>

     <li><input type="checkbox" name="chk6" id="chk6">체크리스트6</li>

     <li><input type="checkbox" name="chk7" id="chk7">체크리스트7</li>

    </ul>

    <div style="padding-top:3px;text-align:right"><input type="button" value="확인" onClick="multiSelect('CLOSE')"></div>

   </div>

</form>

</body> 

</html>

 </body>

</html>
⚠️ **GitHub.com Fallback** ⚠️