JavascriptEditorSimple - алхимически стабильная замена NicEdit и whizzywig html editor

Введение

Используя стандартный визуальный  whizzywig HTML редактор, который можно интегрировать на JS, столкнулся с одной маленькой проблемой - слишком глючит HTML поле при работе с этим редактором на платформе 8.2, а один раз даже платформа 8.3.24 не смогла запустить корректно редактор - не прогрузилась картинка. NicEdit - напротив, много требует за свой слишком маленький функционал (jquery для такого количества команд и интерфейса это излишество). С учетом также того, что мой новый редактор TUI HTML EDITOR разросся слишком сильно по функционалу (поддерживаются по итогу даже перекрестные ссылки как в Word), было принято решение сделать на его основе облеченную версию с меньшим функционалом и кнопочным интерфейсом на русском языке.

Системные требования к движкам браузеров (подойдет любой браузер, который будет иметь в наличии эти движки):

1. Opera presto 9.0 -12.18. Версия до перехода на Webkit.
2. Gecko с поддержкой design mode/contenteditable. Например, Netscape 7.1 (Mozilla 0.8) и новее. 
3. KHTML с версии 4.1 и новее - Konqueror 4.1 на движке khtml.
4. Webkit/Blink - Safari 1.3 и новее, для Chrome все версии. Edge - все версии без исключения.
5. Internet Explorer 4.0 16 bit и до версии 11 включительно.
6. Поле HTML документа 1С 8.0-8.5 на компьютерных платформах.  Под мобильными приложениями есть ограничения ограничения с доступом к содержимому документа HTML, тем не менее на относительно новых версиях использовать возможно.
7. WebView2 и .NET/CLR embedded browsers - полный функционал команд (с 09.02.2026).

Особенности и отличия от аналогов: на каждом дв

Структура редактора - чистый монолит в виде HTML файла, размером меньше 30 кб.

Функционал редактора на 19.01.2026

Базовое форматирование

• Текст: жирный, курсив, подчеркивание, зачеркивание

• Выравнивание: по левому/правому краю, центру, ширине

• Списки: маркированные и нумерованные

• Шрифты и размеры: основные семейства шрифтов, 7 размеров

Расширенные функции

• Работа с цветами: палитры для текста, фона, страницы

• Спецсимволы: математические символы, стрелки, пунктуация

• Таблицы: создание таблиц с настраиваемыми параметрами

• HTML-теги: работа с code, blockquote, cite, samp, q, del, small

Редактор готов к использованию!!!

Интеграция редактора (09.08.2022). Интерфейс устарел , но пока поддерживается.

Требуются 2 вида форм: 

1. Обычные.
2. Управляемые.

var iHTML="<'html><'head><'meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/><'/head><'body> test456<'/body><'/html>" -Содержимое макета ШаблонСтроки.

МакетTeст - взят с git-hub.

Для обычных форм код интеграции выглядит таким образом: 

Процедура ПриОткрытии()
	// Вставить содержимое обработчика.    
		
    //Тащим сам редактор (html содержимое файла редактора):
	ДокументHTML=Обработки.РедакторHTML.ПолучитьМакет("МакетTeст").ПолучитьТекст();

    //Заполняем содержимое Iframe:
	Если ЗначениеЗаполнено(Объект.Ссылка) Тогда
		
		//Шаблон строки замены: 
		СТР_ЗАМЕНА=Обработки.РедакторHTML.ПолучитьМакет("ШаблонСтроки").ПолучитьТекст();
		
        //Содержимое HTML документа из базы:
        СтрокаHTML=РаботаСФайламиСервер.ПолучитьТекстИЗаполнитьВложения(Объект.Ссылка,ЭтаФорма.СписокКартинок,ЭтаФорма.СписокКартинокВБазе);
		
        //Осуществляем сборку редактора: 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,Символы.ПС,"");
		СтрокаHTML=СтрЗаменить(СтрокаHTML,Символы.ВК,""); 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"""","\"""); 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"'","\'"); 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"<","<'");
		СтрокаHTML="var iHTML ="" "+СтрокаHTML+"""";
		ДокументHTML=СтрЗаменить(ДокументHTML,СТР_ЗАМЕНА,СтрокаHTML);

	КонецЕсли;
    
    //Устанавливаем итоговый текст поля HTML документа:
    ЭлементыФормы.ДокументHTML.УстановитьТекст(ДокументHTML);
	

КонецПроцедуры

Процедура ПередЗаписью(Отказ)
	// Вставить содержимое обработчика.  
		
    ДокументПервогоБраузера = ЭлементыФормы.ДокументHTML.Документ;
	ОкноПервогоБраузера     = ДокументПервогоБраузера.parentWindow; // IE
	Если ОкноПервогоБраузера = Неопределено Тогда
		ОкноПервогоБраузера = ДокументПервогоБраузера.defaultView; // Прочие браузеры
	КонецЕсли;
		                      
	//Save To textarea:                          
	ОкноПервогоБраузера.VisibleHTML();
	//Return HTML code from textarea:
	Объект.ОписаниеHTML=ЭлементыФормы.ДокументHTML.document.forms["HTML_CODE"].codetext1.value;
    //Hide html code on redaktor:
    ОкноПервогоБраузера.VisibleHTML();
		
КонецПроцедуры      

Для Управляемых форм код будет почти таким же: 

&НаСервере
Процедура ПриСозданииНаСервере(Отказ, СтандартнаяОбработка)
	//Вставить содержимое обработчика           

   //Тащим редактор 	
   ЭтаФорма.ДокументHTML=Обработки.РедакторHTML.ПолучитьМакет("МакетTeст").ПолучитьТекст();

   //Если у нас уже есть данные - тогда собираем из них итоговый документ:
   Если ЗначениеЗаполнено(Объект.Ссылка) Тогда
		
		
		СТР_ЗАМЕНА=Обработки.РедакторHTML.ПолучитьМакет("ШаблонСтроки").ПолучитьТекст();
		//Получаем HTML строку из базы: 
        СтрокаHTML=РаботаСФайламиСервер.ПолучитьТекстИЗаполнитьВложения(Объект.Ссылка,ЭтаФорма.СписокКартинок,ЭтаФорма.СписокКартинокВБазе);
		//Собираем редактор:
        СтрокаHTML=СтрЗаменить(СтрокаHTML,Символы.ПС,"");
		СтрокаHTML=СтрЗаменить(СтрокаHTML,Символы.ВК,"");

		 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"""","\"""); 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"'","\'"); 
		СтрокаHTML=СтрЗаменить(СтрокаHTML,"<","<'");
		СтрокаHTML="var iHTML ="" "+СтрокаHTML+"""";
        //Итоговая сборка:
		ЭтаФорма.ДокументHTML=СтрЗаменить(ЭтаФорма.ДокументHTML,СТР_ЗАМЕНА,СтрокаHTML);

	КонецЕсли;
	
КонецПроцедуры

&НаКлиенте
Процедура ПередЗаписью(Отказ, ПараметрыЗаписи)
	//Вставить содержимое обработчика 
	
    //Получаем доступ к скриптам:	
	ДокументПервогоБраузера = Элементы.ДокументHTML.Документ;
	ОкноПервогоБраузера     = ДокументПервогоБраузера.parentWindow; // IE
	Если ОкноПервогоБраузера = Неопределено Тогда
		ОкноПервогоБраузера = ДокументПервогоБраузера.defaultView; // Прочие браузеры
	КонецЕсли;

    //Вытаскиваем код из редактора для сохранения базы:
	//Save To textarea:                          
	ОкноПервогоБраузера.VisibleHTML();
	//Return HTML code from textarea:
	Объект.ОписаниеHTML=Элементы.ДокументHTML.document.forms["HTML_CODE"].codetext1.value;
	ОкноПервогоБраузера.VisibleHTML();
	
КонецПроцедуры   

Баг на Windows 11 устранен - редактор работает в штатном режиме!!!