웹마스터 팁
(For 초보)폼안에 내용을 자동선택+자동복사해줍니다.
2004.04.10 19:05
폼안에 있는내용이 버튼을 누르면 자동으로 복사(클립보드에저장)되는
효과를 본적이 있을겁니다
다음은 그 효과를 내는 스크립트입니다
<HTML>
<HEAD>
<TITLE>폼안에 내용을 복사</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
</script>
</HEAD>
<BODY>
<form name="it">
<div align="center">
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy">
<p>
<textarea name="select1" rows="5" cols="40">
위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.
브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.
</textarea>
</div>
</form>
</BODY>
</HTML>
이렇게하면 텍스트박스(맞나?)안에 내용을 복사해줍니다
- 소스 분석 -
<HTML>
<!--HTML의 시작을 알리는 문법-->
<HEAD>
<!--HEAD의 시작을 알림~(즉head 앞대가리)-->
<TITLE>폼안에 내용을 복사</TITLE>
<!--타이틀 지정 폼안에 내용을 복사라는 제목이 타이틀바(제목표시줄)에 나타납니다-->
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--스크립트를 쓰는데 그 언어가 자바스크립트다-->
function copyit(theField) {
<!--레코드를copyit이라고 설정하고괄호안에 필드이름을 집어넣는다고 선언해줌-->
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
<!--복사한다-->
}
</script>
<!--자바스크립트 끝-->
</HEAD>
<!--앞대가리 설정 끝-->
<BODY>
<!--바디 몸이라는뜻으로 눈으로 보여질 부분을 작성-->
<form name="it">
<!--지금부터 폼이 시작되는데 그 이름하여 it라는 폼을 만든다-->
<div align="center">
<!--가운데 정렬(제로보드 게시판설정에도 있죠^^;)-->
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy">
<!--버튼을 만듭니다. 버튼이름은 cpy고 cpy버튼에 나타날 글자는 누르면 복사됩니다 입니다-->
<!--그리고 그 버튼을 클릭하면 copyit이라고 아까 선언해준 자바스크립트가 실행되는데(onclick가 클릭할때-->
<!--실행될 것을 입력한는거입니다) it이라는폼안에 sclect1이라는 글상자에있는 내용을 말하는것입니다-->
<p>
<!--표가 시작됩니다-->
<textarea name="select1" rows="5" cols="40">
위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.
브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.
</textarea>
<!--글상자를 만드는데 글장자 이름이 select1이고 글상자 넓이가 40이고 5줄짜리를 만듭니다-->
<!--그리고 그안에 들어있는내용은 위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.입니다-->
</div>
<!--div가 끝났습니다. 앞에/를 붙여주는것은 그것을 닫는다는 뜻입니다-->
<!--아까 열어줬으니 닫아줘야줘~-->
</form>
<!--폼을 닫습니다-->
</BODY>
<!--몸둥아리를 닫습니다-->
</HTML>
<!--html이 끝났습니다-->
///////////////////////////////////////////
참고
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy" style="background-color:rgb(51,153,255); border-width:1; border-style:none;">
이렇게 버튼을 바꾸면
background-color:rgb(51,153,255); //배경화면이 rgb컬러로 51,153,225인 즉, 하늘색이된 배경화면을 만들수있습니다.
border-width:1; border-style:none;//모든 태두리가 없습니다
-------이상 별거 아닌 스크롤압박만 큰 잡글이었습니다
-------악플도 환영합니다. 그러나 다른사람에게 피해는주지마세요
-------지우라면 지우겠습니다. 그러나 심한욕은 하지말아 주세요
-------중복이라면 제가 검색을 못하는점을 너그럽게 봐주세요
-------질문있으면 nansith@naver.com이나 쪽지나 리플로 남겨주세요
-------초보라서 죄송합니다. 틀린부분이 있으면 바로잡아주세요
효과를 본적이 있을겁니다
다음은 그 효과를 내는 스크립트입니다
<HTML>
<HEAD>
<TITLE>폼안에 내용을 복사</TITLE>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
</script>
</HEAD>
<BODY>
<form name="it">
<div align="center">
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy">
<p>
<textarea name="select1" rows="5" cols="40">
위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.
브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.
</textarea>
</div>
</form>
</BODY>
</HTML>
이렇게하면 텍스트박스(맞나?)안에 내용을 복사해줍니다
- 소스 분석 -
<HTML>
<!--HTML의 시작을 알리는 문법-->
<HEAD>
<!--HEAD의 시작을 알림~(즉head 앞대가리)-->
<TITLE>폼안에 내용을 복사</TITLE>
<!--타이틀 지정 폼안에 내용을 복사라는 제목이 타이틀바(제목표시줄)에 나타납니다-->
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--스크립트를 쓰는데 그 언어가 자바스크립트다-->
function copyit(theField) {
<!--레코드를copyit이라고 설정하고괄호안에 필드이름을 집어넣는다고 선언해줌-->
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
<!--복사한다-->
}
</script>
<!--자바스크립트 끝-->
</HEAD>
<!--앞대가리 설정 끝-->
<BODY>
<!--바디 몸이라는뜻으로 눈으로 보여질 부분을 작성-->
<form name="it">
<!--지금부터 폼이 시작되는데 그 이름하여 it라는 폼을 만든다-->
<div align="center">
<!--가운데 정렬(제로보드 게시판설정에도 있죠^^;)-->
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy">
<!--버튼을 만듭니다. 버튼이름은 cpy고 cpy버튼에 나타날 글자는 누르면 복사됩니다 입니다-->
<!--그리고 그 버튼을 클릭하면 copyit이라고 아까 선언해준 자바스크립트가 실행되는데(onclick가 클릭할때-->
<!--실행될 것을 입력한는거입니다) it이라는폼안에 sclect1이라는 글상자에있는 내용을 말하는것입니다-->
<p>
<!--표가 시작됩니다-->
<textarea name="select1" rows="5" cols="40">
위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.
브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.
</textarea>
<!--글상자를 만드는데 글장자 이름이 select1이고 글상자 넓이가 40이고 5줄짜리를 만듭니다-->
<!--그리고 그안에 들어있는내용은 위의 버튼을 누르면 이 부분이 선택되고 자동으로 복사됩니다.브라우저의 주소입력란에 붙여넣기(Ctrl+V) 해보세요.입니다-->
</div>
<!--div가 끝났습니다. 앞에/를 붙여주는것은 그것을 닫는다는 뜻입니다-->
<!--아까 열어줬으니 닫아줘야줘~-->
</form>
<!--폼을 닫습니다-->
</BODY>
<!--몸둥아리를 닫습니다-->
</HTML>
<!--html이 끝났습니다-->
///////////////////////////////////////////
참고
<input onclick="copyit('it.select1')" type="button" value="누르면 복사됩니다" name="cpy" style="background-color:rgb(51,153,255); border-width:1; border-style:none;">
이렇게 버튼을 바꾸면
background-color:rgb(51,153,255); //배경화면이 rgb컬러로 51,153,225인 즉, 하늘색이된 배경화면을 만들수있습니다.
border-width:1; border-style:none;//모든 태두리가 없습니다
-------이상 별거 아닌 스크롤압박만 큰 잡글이었습니다
-------악플도 환영합니다. 그러나 다른사람에게 피해는주지마세요
-------지우라면 지우겠습니다. 그러나 심한욕은 하지말아 주세요
-------중복이라면 제가 검색을 못하는점을 너그럽게 봐주세요
-------질문있으면 nansith@naver.com이나 쪽지나 리플로 남겨주세요
-------초보라서 죄송합니다. 틀린부분이 있으면 바로잡아주세요
댓글 6
-
오승민
2004.04.16 13:00
-
쉬드
2004.04.17 14:20
^^ -
Danggn™
2004.04.17 15:11
근데요... 제로보드쓰니까 안되요..;; -
쉬드
2004.04.18 21:46
전 제로보드에서가 아니라
일반 html웹페이지를 말하는것이었는데─.┬ -
김민선
2004.07.15 16:32
저는 오늘부터 쉬드의 여자친구에요~ -
N*
2005.06.15 18:17
^^ 참 오래 전 글인데...
읽는 동안 미소가... ㅎㅎ
소스 설명... 정말 멋지네요... 재밌었어요.
정말 완전 초보님들을 위한 강좌홈 운영하시면 딱이시겠어요 ^*^
| 제목 | 글쓴이 | 날짜 |
|---|---|---|
| 동영상과 함께 자막 재생하기. [4] | 세강:D | 2004.08.16 |
| 도메인 포워딩 하기 [4] | 나준혁 | 2004.07.27 |
| 이미지에 필터만으로 그림자주기.. [15] | Simsim | 2004.07.07 |
| 어쩌다 나온 깔끔한 그레이 스크롤바.. 흠흠.. [11] | ☺심심 | 2004.06.06 |
| relative 속성 레이어를 이용한 메뉴를 자리차지하지 않게... [1] | PHASE | 2004.06.03 |
| 처음올립니다;ㅂ; 너무 신기한 거 발견;; [19] | 올리못™ | 2004.05.30 |
| 아이프레임 가로스크롤바 없애기 [3] | 백승창 | 2004.05.28 |
| 아기창 뜨고 부모창 닫기 [6] | 임소식 | 2004.05.19 |
| 플래시 swf파일 배경 투명하게 하기 ~~~ [8] | kim's | 2004.05.09 |
| 자동 스크롤 메뉴 (끄기 기능, 무한 스크롤 X) [6] | ☺심심 | 2004.05.02 |
| 홈페이지 빠르게하는 [로딩속도를 높히는 10가지방법] [20] | kim's | 2004.04.29 |
| [tip]간단한 반투명 필터 적용법 [2] | 드래군 | 2004.04.21 |
| 제로보드에서 손쉽게 복사하는 소스 (아래보다 더 편함..) [2] | Danggn™ | 2004.04.17 |
| (For 초보)폼안에 내용을 자동선택+자동복사해줍니다. [6] | 쉬드 | 2004.04.10 |
| 모든 스킨에서 중국어 간체 볼 수 있도록 해주는 법... [6] | 학몽 | 2004.03.09 |
| 스타일 시트파일을 만들기 .. [4] | 박종익 | 2004.03.07 |
| 간단하게, 색깔있는 밑줄 긋기. [4] | naughtykidd | 2004.02.27 |
| 몇 가지 팁..( 좀 깁니다.. 어느 정도 안다고 생각하시는 분들, 추천 ) [3] | naughtykidd | 2004.02.26 |
| 스타일시트를 이용한 텍스트박스 스타일 제어(밑줄,점선) [8] | 01CODE.com | 2004.02.26 |
| 전송버튼의 테두리를 없애 BoA요 >_< [7] | 플로렐라 | 2004.02.14 |
클릭하면 자동으로 복사해주는기능 ...
좋은 정보 감사합니다