현재 위치

홈 ›› Forums ›› 공부 ›› 프로그래밍 QnA

iframe에 어떻게 글을 써 넣을 수 있을까요?

이한길의 이미지
글쓴이: 이한길 / 작성시간: 목, 2005/09/01 - 9:31오후

GMAIL의 RTF형식 에디터도 그렇고
FCKeditor도 그렇고 가만 보니깐..

iframe에다가 대고 글을 쓰고...
그것을 보여주는 것 같은데요....

어떻게 iframe에다가 글을 쓰게 만들 수 있을까요?

Forums: 
프로그래밍 QnA
송효진의 이미지

글쓴이: 송효진 / 작성시간: 목, 2005/09/01 - 9:47오후

궁금하신것이 그냥 글 쓰는거라면,
iframe 안에 textarea 있으면 그냥 글 써지고요.

웹에디터 기능이 궁금하신거면, 익스플로러나 겍코엔진(모질라,불여우) 에서 제공하는 기능을 JS 로 제어하는겁니다.

지메일 보니 소스가 좀 복잡한듯 한데,
CHEditor, HTMLArea 같은거 소스 보시면 됩니다.

1. 수정가능한 객체를 선언하고,
2. 버튼에 JS 이벤트를 걸어서,
3. exec("bold") 같은 식으로 제공되는 명령을 내리는거죠.

iframe 안에 넣었다면, submit 이벤트로 textarea 같은곳으로 복사해 오는것도 필요하겠죠.

https://xenosi.de/

cppig1995의 이미지

글쓴이: cppig1995 / 작성시간: 금, 2005/09/02 - 4:19오후

<IFRAME name="embedded" />

embedded.document.open();
embedded.document.write();
embedded.document.close();

Real programmers /* don't */ comment their code.
If it was hard to write, it should be /* hard to */ read.

이한길의 이미지

글쓴이: 이한길 / 작성시간: 금, 2005/09/02 - 11:58오후

답변 주셔서 정말 감사합니다.

송효진 wrote:
웹에디터 기능이 궁금하신거면, 익스플로러나 겍코엔진(모질라,불여우) 에서 제공하는 기능을 JS 로 제어하는겁니다.

지메일 보니 소스가 좀 복잡한듯 한데,
CHEditor, HTMLArea 같은거 소스 보시면 됩니다.

둘다 free는 아닌듯 싶은데요...
그리고 FCKeditor의 경우 free이지만 보니까
소스가 상당히 복잡합니다.. 결국 ㅡㅡ;;

cppig1995 wrote:
<IFRAME name="embedded" /> 

embedded.document.open();
embedded.document.write();
embedded.document.close();

방금 아래처럼 해봤습니다만 iframe에 글이 안써지네요..
제가 뭘 잘못한 걸까요?

<html>
<body>
<IFRAME name="embedded" id="embedded" /> 
<script language="javascript">
embedded.document.open(); 
embedded.document.write(); 
embedded.document.close(); 
</script>
</body>
</html>

혹시 관련 정보를 얻을 수 있는 무슨 사이트 없을까요?

아.. 그리고 iframe내에서 글자 입력이 되듯..
그냥 페이지에서도 입력이 되게 할 수 있는건가요?

----
먼저 알게 된 것을 알려주는 것은 즐거운 일이다!
http://hangulee.springnote.com
http://hangulee.egloos.com

송효진의 이미지

글쓴이: 송효진 / 작성시간: 토, 2005/09/03 - 12:21오전

CHEditor 를 보시라고 한것은 비교적 간단한 소스이기 때문입니다.
핵심은 EditAble 과 exec() 입니다.
그것을 집중적으로 보고
msdn 과 mozilla.org 에서 검색하세요.
mozilla 에서는 midas 라는 예제도 있습니다.

매뉴얼 없이 제작하려 하시면 안됩니다.
소스는 어디까지나 참고사항.

분명 EditAble 속성이 frame 단위가 아니지만, 이런저런 기능을 구현하려 하면 iframe 으로 하는것이 속 편할겁니다.
그리고 textarea 같은게 아니므로 어차피 onsubmit 에 이벤트로 넣어야 합니다.

-----------

cppig1995 님이 제시한 예제는 JS 로 직접 frame 내용을 채우는 것입니다.
키보드 입력을 받는게 아닙니다.

https://xenosi.de/

이한길의 이미지

글쓴이: 이한길 / 작성시간: 일, 2005/09/04 - 9:38오후

송효진 wrote:
CHEditor 를 보시라고 한것은 비교적 간단한 소스이기 때문입니다.
핵심은 EditAble 과 exec() 입니다.
그것을 집중적으로 보고
msdn 과 mozilla.org 에서 검색하세요.
mozilla 에서는 midas 라는 예제도 있습니다.

매뉴얼 없이 제작하려 하시면 안됩니다.
소스는 어디까지나 참고사항.

분명 EditAble 속성이 frame 단위가 아니지만, 이런저런 기능을 구현하려 하면 iframe 으로 하는것이 속 편할겁니다.
그리고 textarea 같은게 아니므로 어차피 onsubmit 에 이벤트로 넣어야 합니다.

-----------

cppig1995 님이 제시한 예제는 JS 로 직접 frame 내용을 채우는 것입니다.
키보드 입력을 받는게 아닙니다.

감사합니다..
그렇잖아도 간단한 예제를 한번 보고 싶었는데..
midas라는게 있었네요..

----
먼저 알게 된 것을 알려주는 것은 즐거운 일이다!
http://hangulee.springnote.com
http://hangulee.egloos.com

cppig1995의 이미지

글쓴이: cppig1995 / 작성시간: 수, 2005/10/12 - 5:21오후

송효진 wrote:
cppig1995 님이 제시한 예제는 JS 로 직접 frame 내용을 채우는 것입니다.
키보드 입력을 받는게 아닙니다.

전 키보드 이벤트 받아채는거 잘 못해요. :twisted:
(... 함수 만드신 다음, 센스있는 '개체명.keypress=함수명' 이 필요합니다. :evil: 함수는... 특수키 채취 뒤 받은 charcode를 iframe에 document.write하면 될것 같은데.)

Real programmers /* don't */ comment their code.
If it was hard to write, it should be /* hard to */ read.

송효진의 이미지

글쓴이: 송효진 / 작성시간: 수, 2005/10/12 - 5:37오후

cppig1995 wrote:
전 키보드 이벤트 받아채는거 잘 못해요.

그 얘기가 아니에요.
웹에디터 얘기에요.
midas 한번 보세요. (불여우에서)

https://xenosi.de/

댓글 달기

텍스트 포맷에 대한 자세한 정보

Filtered HTML

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

BBCode

  • 텍스트에 BBCode 태그를 사용할 수 있습니다. URL은 자동으로 링크 됩니다.
  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param>
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.

Textile

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • You can use Textile markup to format text.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Markdown

  • 다음 태그를 이용하여 소스 코드 구문 강조를 할 수 있습니다: <code>, <blockcode>, <apache>, <applescript>, <autoconf>, <awk>, <bash>, <c>, <cpp>, <css>, <diff>, <drupal5>, <drupal6>, <gdb>, <html>, <html5>, <java>, <javascript>, <ldif>, <lua>, <make>, <mysql>, <perl>, <perl6>, <php>, <pgsql>, <proftpd>, <python>, <reg>, <spec>, <ruby>. 지원하는 태그 형식: <foo>, [foo].
  • Quick Tips:
    • Two or more spaces at a line's end = Line break
    • Double returns = Paragraph
    • *Single asterisks* or _single underscores_ = Emphasis
    • **Double** or __double__ = Strong
    • This is [a link](http://the.link.example.com "The optional title text")
    For complete details on the Markdown syntax, see the Markdown documentation and Markdown Extra documentation for tables, footnotes, and more.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 사용할 수 있는 HTML 태그: <p><div><span><br><a><em><strong><del><ins><b><i><u><s><pre><code><cite><blockquote><ul><ol><li><dl><dt><dd><table><tr><td><th><thead><tbody><h1><h2><h3><h4><h5><h6><img><embed><object><param><hr>

Plain text

  • HTML 태그를 사용할 수 없습니다.
  • web 주소와/이메일 주소를 클릭할 수 있는 링크로 자동으로 바꿉니다.
  • 줄과 단락은 자동으로 분리됩니다.
댓글 첨부 파일
이 댓글에 이미지나 파일을 업로드 합니다.
파일 크기는 8 MB보다 작아야 합니다.
허용할 파일 형식: txt pdf doc xls gif jpg jpeg mp3 png rar zip.
CAPTCHA
이것은 자동으로 스팸을 올리는 것을 막기 위해서 제공됩니다.