Jak mogę wyświetlić formatowanie HTML wewnątrz obszaru tekstowego?

Question

Mam kod, który umożliwia formatowanie tekstu w obszarze tekstowym za pomocą pogrubienia, podkreślenia, przekreślenia lub kursywy. Ale wyświetla znaczniki html zamiast faktycznie je formatować. Wiem, że raz wyprowadzam go wewnątrz div, to będzie sformatowany, ale chcę pokazać formatowanie, podczas gdy użytkownik pisze tekst.

Jak mogę włączyć formatowanie? JavaScript jest w porządku, używam JQuery w tej chwili. Wolałbym też nie używać edytora WYSIWYG, jeśli istnieje inna opcja.

Dzięki za pomoc.

Answer 1

Uważam, że jest to możliwe tylko za pomocą elementu div lub innego elementu HTML, który można stylizować zamiast tekstu. Z Javascriptem dodasz wtedy funkcjonalność textarea.

A może użyjesz takiego systemu formatowania, jak tutaj, w SO? Jest to według mnie znacznie bardziej eleganckie niż pseudo WYSIWYG.

Answer 2

Zamień textarea na div i włącz tryb projektowania. Lub możesz użyć wtyczki jquery http://plugins.jquery.com/project/designMode

Answer 3

Nie można zrobić wewnątrz Textarea, będziesz musiał przejść do edytora WYSIWYG lub czegoś w tym stylu. Łatwo jest zrobić tego samemu. Jest to całkiem dobry tutorial:

Devgurus wysiwyg tutorial

Answer 4

atrybut Zastosowanie contentEditable na div elementu

<div contentEditable="true"> 
</div 

ten sposób można sformatować wejście w dowolny sposób, po prostu nie zapomnij poprawnie uciec danych.

Answer 5

Po prostu myśl; Jeśli chcesz, aby użytkownicy zobaczyli, jak będzie wyglądała ich odpowiedź, możesz wziąć wskazówkę z tej strony i mieć coś w rodzaju "podglądu" div tuż nad/pod polem komentarza. Możesz użyć onKeyUp, aby wstawić kod do elementu div, aby zachować go do zrobienia zgodnie z typem użytkownika. To nie jest doskonałe, ale prawdopodobnie jest tak dobre, jak masz, jeśli nie chcesz używać WYSIWYG.

Opcja contentEditable + WYSIWYG jest prawdopodobnie bardziej przyjazna dla użytkownika i prostsza, IMHO.