이전다음

7. 자바스크립트

7.1. idcheck를 위한 예제

기존에 아이디가 있나 없나를 체크를 하기 위해서.

idcheck.htm
<html>
<script language="JavaScript">

function id_chk(obj)
{
  var form = document.select1;
  var w_id_chk;
  if ( form.s_id.value == "" ) 
  {
    alert("아이디를 입력하지 않았습니다.");
    form.s_id.focus();
    return;
  } else if ((form.s_id.value.toString().length < 4) || (form.s_id.value.toString().length > 10)) 
  {
    alert("아이디는 4자이상 10자이내로 입력하여 주십시요.");
    form.s_id.focus();
    return;
  }
  ck=1;
  var str = 'idcheck.php?s_id='+obj.s_id.value;
  window.open(str,'w_id_chk','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,width=300,height=150');
  return;
}

</script>

<body>
<form method=post name=select1 >
<table>
  <tr>
    <td width = 200 BGCOLOR="#F2F5F1" align = right><font size="2" color="red">*</font><font size="2">수강생 아이디</font></td>
    <td width = 550><font size="2"><input type=text name=s_id size=8 maxlength=8> 
      <input TYPE='buton' NAME='chkbutton' VALUE='중복아이디 확인' onClick="deny_javascript:id_chk(this.form);"></a>
        <br>4~8자 영문숫자 조합, 첫글자는 영문, 대소문자 구별안함</font></td>
    </tr>
</table>
</from>

</body>
</html>

idcheck.php
<html>
<body>
<?
include "db.ph";
db_connect();

$sth3 = mysql_query("select id from cls_member where id = '$s_id'");

$total = mysql_affected_rows(); //게시물 총 수

if($total == "0") 
{
  print "<br><br><br><font size = 2>$s_id 는 사용할수 있는 아이디 입니다.</font>";
}
else 
{
  print "<br><br><br><font size = 2>$s_id 는 이미 사용중인 아이디 입니다.</font>";
}

?>
</body>
</html>

7.2. 메뉴 만들기 예제

<html>
<script language="JavaScript">
<!--

// 마우스를 주메뉴 위에 올려 놓으면 부메뉴가 나오게 하는 스크립트
function MM_findObj(n, d) { //v3.0

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); return x;

}


function MM_showHideLayers() { //v3.0

  var i,p,v,obj,args=MM_showHideLayers.arguments;

  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];

    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }

    obj.visibility=v; }

}


// 부메뉴 롤오버 기능
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v3.0
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

//-->


</script>

<body marginheight=0 marginwidth=0 topmargin=0 rightmargin=0 leftmargin="0" bgcolor="ffffff">
<table width="780" border="0" cellspacing="0" cellpadding="0" >

<tr><td height="67" ></td><td height="67" width="120"><img src="top_img/p0.gif"></td></tr>
<tr><td><a href="#" onMouseOver="MM_showHideLayers('about1','','show', 'glmoum','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></A><a href="#" onMouseOver="MM_showHideLayers('product1','','show', 'glmoum','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></a><a href="#" onMouseOver="MM_showHideLayers('news1','','show', 'glmoum','','hide')"><img name="news" border="0" src="menu_img/news0.gif" width="54" height="33"></a><a href="#" onMouseOver="MM_showHideLayers('mdata','','show', 'glmoum','','hide')"><img name="data" border="0" src="menu_img/data0.gif" width="99" height="33"></a><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','show', 'glmoum','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></a><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','show', 'study','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></a><a href="#" onMouseOver="MM_showHideLayers('msitemap','','show', 'study','','hide')"><img name="map" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></a><img name="map" border="0" src="top_img/blank.gif" width="66" height="33"></td><td height="33" width="120"><img src="top_img/p1.gif"></td></tr>


</table>


<!-- about us -->
<div id="about1" style="position:absolute; z-index:1; left: 0; top: 67 ;visibility: hidden"> 

<!-- 주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
   <td><img name="about" border="0" src="menu_img/aboutus1.gif" width="85" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="product" border="0" src="top_img/blank.gif" width="73" height="33"></a></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('about1','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
   </tr>
</table>

<table border="0" cellspacing="0" cellpadding="0" > <tr> 

<!--   부메뉴 -->
<td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="../about1.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 1','','menu_img/about_11.gif',0)"><img name="about sub 1" border="0" src="menu_img/about_10.gif" width="154" height="28"></a><a href="../about2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 2','','menu_img/about_21.gif',0)"><img name="about sub 2" border="0" src="menu_img/about_20.gif" width="85" height="28"></a><a href="../about3.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 3','','menu_img/about_31.gif',0)"><img name="about sub 3" border="0" src="menu_img/about_30.gif" width="102" height="28"></a><a href="../about4.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 4','','menu_img/about_41.gif',0)"><img name="about sub 4" border="0" src="menu_img/about_40.gif" width="86" height="28"></a><a href="about5.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 5','','menu_img/about_51.gif',0)"><img name="about sub 5" border="0" src="menu_img/about_50.gif" width="166" height="28"></a><a href="about6.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('about sub 6','','menu_img/about_61.gif',0)"><img name="about sub 6" border="0" src="menu_img/about_60.gif" width="67" height="28"></a></td><td height="28" width="120"><img src="top_img/blank.gif" WIDTH="100" HEIGHT="5"></td></tr>
</table>
</div>


<!-- product -->
<div id="product1" style="position:absolute; z-index:1; left: 0; top: 67 ;visibility: hidden"> 

<!--  주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr> 
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></a></td>
  <td><img name="product" border="0" src="menu_img/product1.gif" width="73" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('product1','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
  </tr> 
</table>

<!-- 부메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr> 
    <td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="product1.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('product 1','','menu_img/product_11.gif',0)"><img name="product 1" border="0" src="menu_img/product_10.gif" width="80" height="28"></a><a href="product2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('product 2','','menu_img/product_21.gif',0)"><img name="product 2" border="0" src="menu_img/product_20.gif" width="116" height="28"></a><a href="product3.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('product 3','','menu_img/product_31.gif',0)"><img name="product 3" border="0" src="menu_img/product_30.gif" width="148" height="28"></a><a href="product4.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('product 4','','menu_img/product_41.gif',0)"></td>
</tr> 
</table></div>

<!-- news -->
<div id="news1" style="position:absolute; z-index:1; left: 0; top: 67 ;visibility: hidden"> 

<!-- 주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></a></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></a></td>
  <td><img name="product" border="0" src="menu_img/news1.gif" width="54" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('news1','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
</table>

<!-- 부메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
    <td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="news1.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news 1','','menu_img/news_11.gif',0)"><img name="news 1" border="0" src="menu_img/news_10.gif" width="95" height="28"></a><a href="news2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news 2','','menu_img/news_21.gif',0)"><img name="news 2" border="0" src="menu_img/news_20.gif" width="179" height="28"></a><a href="news3.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news 3','','menu_img/news_31.gif',0)"><img name="news 3" border="0" src="menu_img/news_30.gif" width="122" height="28"></a><a href="news4.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('news 4','','menu_img/news_41.gif',0)"></td>
</tr> 
</table></div>



<!-- data -->
<div id="mdata" style="position:absolute; height: 50; z-index:1; left: 0; top: 67; visibility: hidden"> 

<!-- 주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr> 
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></A></td>
  <td><img name="coll" border="0" src="menu_img/data1.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mdata','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
 </tr> 
</table>

<!-- 부메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
    <td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="data1.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('data room 1','','menu_img/data_11.gif',0)"><img name="data room 1" border="0" src="menu_img/data_10.gif" width="85" height="28"></a><a href="data2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('data room 2','','menu_img/data_21.gif',0)"><img name="data room 2" border="0" src="menu_img/data_20.gif" width="196" height="28"></a><a href="data3.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('data room 3','','menu_img/data_31.gif',0)"><img name="data room 3" border="0" src="menu_img/data_30.gif" width="111" height="28"></a><a href="data4.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image30','','menu_img/data_41.gif',0)"></td>
</tr> 
</table></div>


<! -- collaborator -->
<div id="mcollaborator" style="position:absolute; height: 50; z-index:1; left: 0; top: 67; visibility: hidden">

<!--  주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr> 
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></A></td>
  <td><img name="coll" border="0" src="menu_img/collaborator1.gif" width="110" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
  <td><a href="#" onMouseOver="MM_showHideLayers('mcollaborator','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
</table>

<!-- 부메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
    <td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="coll1.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('collaborator 1','','menu_img/collaborator_11.gif',0)"><img name="collaborator 1" border="0" src="menu_img/collaborator_10.gif" width="129" height="28"></a><a href="coll2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('collaborator 2','','menu_img/collaborator_21.gif',0)"><img name="collaborator 2" border="0" src="menu_img/collaborator_20.gif" width="158" height="28"></a></td>
</tr> 
</table></div>


<!-- contactus -->
<div id="mcontactus" style="position:absolute; height: 50; z-index:1; left: 0; top: 67; visibility: hidden"> 

<!-- 주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr> 
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></A></td>
   <td><img name="contact" border="0" src="menu_img/contactus1.gif" width="99" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('mcontactus','','hide')"><img name="contact" border="0" src="menu_img/sitemap0.gif" width="74" height="33"></td>
</table>

<!-- 부메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>

    <td width=660 height="28" colspan="2" bgcolor="#0D3689"><a href="contactus.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('contactus 1','','menu_img/contactus_11.gif',0)"><img name="contactus 1" border="0" src="menu_img/contactus_10.gif" width="134" height="28"></a><a href="contactus2.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('contactus 2','','menu_img/contactus_21.gif',0)"><img name="contactus 2" border="0" src="menu_img/contactus_20.gif" width="78" height="28"></a><a href="contactus3.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('contactus 3','','menu_img/contactus_31.gif',0)"></td>

</tr> 
</table></div>

<! -- sitemap -->
<div id="msitemap" style="position:absolute; height: 50; z-index:1; left: 0; top: 67; visibility: hidden">

<!  -- 주메뉴 -->
<table border="0" cellspacing="0" cellpadding="0" > <tr>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="about" border="0" src="menu_img/aboutus0.gif" width="85" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="product" border="0" src="menu_img/product0.gif" width="73" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="product" border="0" src="menu_img/news0.gif" width="54" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="coll" border="0" src="menu_img/data0.gif" width="99" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="coll" border="0" src="menu_img/collaborator0.gif" width="110" height="33"></td>
   <td><a href="#" onMouseOver="MM_showHideLayers('msitemap','','hide')"><img name="contact" border="0" src="menu_img/contactus0.gif" width="99" height="33"></td>
   <td><img name="map" border="0" src="menu_img/sitemap1.gif" width="74" height="33"></td>
   </tr>
</table>
<!-- 부메뉴 -->
</table><table border="0" cellspacing="0" cellpadding="0" > <tr><td></td></tr> 
</table>
</div>

</table>
</body>
</html>

이전처음으로다음
Php Oracle