Плагин jQuery для редактора HTML с раскраской синтаксиса

Я ищу плагин jQuery, который будет отображать текстовое поле для создания и редактирования HTML.

То, что я ищу:

  1. Должен поддерживать создание HTML, а не WYSIWYG-представление
  2. HTML должен раскрашивать по мере ввода, как это сделала бы любая IDE с расширенным клиентом.
  3. Должен быть jQuery, но подойдет и собственный JS.

Я играл с MarkItUp, который дает мне 90%, но не предлагает синтаксической окраски. И WYMeditor, насколько я могу судить, не имеет опции для «просмотра кода», а вместо этого является просто представлением WYSIWYG.

Кто-нибудь делал что-то подобное в прошлом?


javascript jquery jquery-plugins
person Shane H    schedule 05.08.2009    source источник

Ответы (5)


arrow_upward
45
arrow_downward

Используйте CodeMirror. Это маркер, используемый Google для своей площадки API.

Я пробовал, и он хорошо работает, и, согласно их сайту, он работает в следующих браузерах:

  • Firefox 1.5 или выше
  • Internet Explorer 6 или выше
  • Safari 3 или выше
  • Opera 9.52 или выше
  • Хром

Я не понимаю, почему вы упоминаете jQuery в этом случае, поскольку jQuery не имеет ничего общего с тем, что вам нужно сделать, кроме его механизма выбора, который можно использовать для поиска текстового поля, для которого вы хотите включить подсветку синтаксиса (хотя, если вы поставите an id, для этого вам также не понадобится jQuery.)

Лучше использовать отдельную библиотеку, которая специально разработана для решения поставленной задачи (каковой является CodeMirror). Вы получите максимальную производительность, и разработчики будут более удобны в обслуживании, что обеспечит лучшее качество кода. .

person Blixt    schedule 05.08.2009
comment
+1 за CodeMirror и виртуальный +1 за упоминание о том, что jQuery не является решением всех проблем. - person Boldewyn; 05.08.2009
comment
Я согласен с тем, что jQuery не является решением всех проблем, но запрос решения jQuery может означать: 1) разработчик знает jQuery, поэтому, если им придется его настраивать, они будут чувствовать себя более комфортно. 2) от нуля до минимальной конфигурации 3) jQuery абстрагирует различия браузеров, поэтому как разработчик вы можете чувствовать себя более уверенно, что плагин лучше поддерживает кроссбраузерность, чем чистое нативное решение. - person Brad Parks; 19.12.2012

arrow_upward
5
arrow_downward

Вам также следует взглянуть на EditArea.

Он не использует jquery, но и не конфликтует с ним.

person Lucky    schedule 05.08.2009

arrow_upward
5
arrow_downward

Взгляните на Ace, в который Mozilla объединила их Skywriter / Bespin усилия. Он поддерживает более 60 языков с подсветкой синтаксиса кода на стороне клиента. Исходный код открыт и доступен на github.

person DavGarcia    schedule 28.07.2013

arrow_upward
5
arrow_downward

Я также использовал Codemirror на kodingen.com, теперь это koding.com, Codemirror очень хорошо написан, вы можете получить исходный код и изменить его по своему усмотрению.

Но вы также можете проверить amyeditor, он также очень продвинутый и поддерживает больше языков, чем codemirror. Вы также можете получить его исходный код на github.

Надеюсь, поможет...

person Sinan    schedule 05.08.2009

arrow_upward
1
arrow_downward

Надо использовать Bespin от Mozilla. Он построен с использованием функций HTML5 (так что он быстрый и быстрый, но не поддерживает устаревшие браузеры), но определенно великолепен в использовании и превосходит все, с чем я сталкивался - вероятно, потому, что его поддерживает Mozilla, и они разрабатывают Firefox, так что да. .. Существует также плагин jQuery, который содержит его расширение чтобы упростить использование с jQuery.

person balupton    schedule 27.07.2010
comment
@CodeClown и Skywriter теперь называются Ace (та же ссылка на источник, что и ваша ...) - странное исправление, которое нужно сделать ... - person balupton; 20.02.2015