HTML جافا سكريبت مربع النص الغني (IDE)

Question

آمل أن أقوم ببناء IDE في JavaScript يتصرف كثيرا مثل Gmail باستثناء النمط سيغير تلقائيا بناء على ما يكتبه. المنطق لهذا ليس المكان الذي تكافح فيه. في كيفية تحقيق Gmail القدرة على التعديل بتنسيق تحرير غني في HTML. بقدر ما أعرف أن عنصر التحكم Textarea لا يعمل بهذه الطريقة، فكيف أنهم وهمية هذه الوظيفة؟

Answer 1

جوجل ل "محتوى قابل للتحرير" محاولة الضغط على F7 في Firefox End تحرير صفحة HTML مباشرة :) يستخدم Gmail الإطار داخل صفحة ذات حدود = "صحيح".

انظر أيضا مجموعة أدوات Google Web:http://code.google.com/docreader/# p=google-web-toolkit-doc-1-5&s=google-web-toolkit-doc-1-5&t=devguidewidgallery.هناك القطعة Richtextarea.

Answer 2

لست متأكدا ما إذا كان هذا هو ما تقصده، لكن هل تبحث عن محرر WYSIWYG عبر الإنترنت؟

في هذه الحالة تسمح لي أن أوصى ckeditor., ، إنه سريع جدا وحديث وقوي.

يمكنك العثور على قائمة أوسع في المقابلة دخول ويكيبيديا.

ربما يتعين عليك تخصيص أي من المحررين لتتمكن من تحرير رسائل البريد الإلكتروني (لن تتمكن من العمل مع أي فصول CSS محددة مسبقا على سبيل المثال، لذلك سيتعين على المحرر القيام بكل تعريفات النمط مباشرة العلامة) ولكن لا ينبغي أن تكون مشكلة.

Answer 3

قم بتنزيل أحد العديد من نظام المصدر المفتوح الذي يسمح بذلك، ونرى كيف فعلوا ذلك.
في الأساس، يقومون بإرفاق معالجات الحدث إلى زر بدوره يعرف كيفية إدراج "الأشياء" في المكان الذي يوجد فيه المؤشر موجودا حاليا في منطقة النص، أو حول المنطقة المحددة في Textarea.

Answer 4

تصويتي هوEditarea.ما هو في قائمة المحررين على الويب: آخر دخول ويكيبيديا.

تمكنت من إضافتها إلى صفحة موجودة بأكثر الرمز أبسط:

<script language="javascript" type="text/javascript" src="edit_area/edit_area_full.js"></script>
<script language="javascript" type="text/javascript" >
editAreaLoader.init({
  id: "my_textarea_id"   // ID of textarea to turn into syntax editor.
  , syntax: "php"
  , start_highlight: true
  , allow_resize: "both"
  , toolbar: "search, go_to_line, |, undo, redo, |, highlight, reset_highlight, word_wrap,|,syntax_selection"
  , min_height:150
  , min_width:400
});
</script>