>source

그래서 나는 보여주고 싶다이미지 썸네일< TextArea >텍스트와 함께. 자바 스크립트 솔루션을 알고있는 경우 (가능한 경우 바닐라 JS)

다음과 같이 :

__________________
|Hello World     |
|  _______       |
|  | Img |       |
|  |     |       |
|  |_____|       |
|Hello again.    |
|  _______       |
|  | Img2|       |
|  |     |       |
|  |_____|       |
|________________|

Div 또는 무엇이 있는지 아는 것처럼Contenteditable= "true"이미지도 가능하지만 다른 많은 HTML 태그와 내가 원하지 않는 많은 것들을 허용합니다. |

나는 원한다본문이미지...에

  • 답변 # 1

    원하지 않는 요소가 있는지 확인하는 스크립트 (PHP에서 이상적으로)를 작성할 수 있습니다 (< >또는< img >짐마자

    사용자를 "양식"으로 보내고 다시 채우도록 또는 전체 원치 않는 태그를 삭제할 수 있습니다.

  • 답변 # 2

    TextArea와 같은 작동하는 ContentEdable 속성을 사용하여 Div를 사용하십시오. 그것이 WYSIWYG 편집자가 생성되는 방법입니다.

    div {
      width: 300px;
      height: 200px;
      border: 1px solid #ccc;
    }

    <div contentEditable="true">Type here. You can insert images too
      <img src="http://t2.gstatic.com/images?q=tbn:ANd9GcQCze-mfukcuvzKk7Ilj2zQ0CS6PbOkq7ZhRInnNd1Yz3TQzU4e&amp;
    t=1" /></div>

    뉴라인을 삽입하려고하면 예제는 정말로 이상합니다. 적어도 크롬에서.

    aroth2021-04-19 08:44:35

    @aroth는 모든 뉴 라인이 새 Div 요소를 생성하고 모든 Div에는 폭, 높이 및 테두리 속성이 있기 때문입니다.

    KhalilRavanna2021-04-19 08:44:35
  • 답변 # 3

    텍스트와 그림을 편집하려는 것을 이해하지만 ... 왜 텍스트 쟁이 안에 있어야합니까? 이러한 제어는 일반 텍스트를 유지하도록 설계되었습니다. JavaScript로 작성된 많은 HTML 편집기가 있습니다.

    나는 복잡한 편집기를 만들고 싶지 않기 때문에, 나는 그냥 텍스트와 사진을 원한다고 말했다.

    Adam Halasz2021-04-19 08:44:35

    사용자의 질문은 특히 텍스트 영역에 관한 것입니다.

    Dustin Oprea2021-04-19 08:44:35

    @dustinoprea -불가능합니다. 기간.