본문 바로가기

프로그래밍/Java/Javascript/Html

자바스크립트... 파일폼의 '찾아보기' 버튼 다른걸로

/*
  사용법 :
   
    1) 본 자바스크립트 파일을 문서에 포함시킨다
   
       예)
        <script language="javascript" src="filebutton.js"></script>
      
      
    2) body 태그의 onload 속성에 다음과 같은 내용을 넣어준다
 
       예)
        <body onload="initFileButton();">
      
      
    3) 원래 다음과 같은 형식이었을때...
 
        <form>
          <input type="file" name="yehbaby">
        </form>
      
       를...
      
        <form>
          <div filename="yehbaby"></div>
          <font filebutton="yehbaby">찾아봅세</font>
        </form>
         
       이렇게 바꾼다. (div 태그는 반드시 form 태그 안에 있어야 한다)
      

    4) 만약 글자가 아닌 그림으로 하고 싶으면 다음처럼 한다...
   
        <form>
          <div filename="yehbaby"></div>
          <img filebutton="yehbaby" src=".....">
        </form>

   
    5) 파일의 경로를 텍스트박스를 통해 보여주고 싶을때에는 display 속성을 사용하여 다음처럼 한다.

        <form>
          <div filename="yehbaby" displaytext="hahatext"></div>
          <input type="text" name="hahatext">
          <img filebutton="yehbaby" src=".....">
        </form>
*/