Я пишу браузерный текстовый редактор для одного из моих проектов. Каждый текст имеет заголовок, который пользователь может редактировать. Пользователь не должен иметь возможность форматировать этот заголовок или добавлять к нему html, он должен быть просто строкой.
Элемент <input type="text"> был бы идеальным, но поскольку заголовки могут быть очень длинными, мне нужно перенос строки, насколько я знаю, что тег ввода не может сделать.
I можно использовать <textarea>, но это позволит пользователю вручную добавлять разрывы строк, чего я не хочу.
Я могу использовать <p contenteditable="true">, но это может добавить нежелательную разметку, и пользователь будет возможность вставлять разрывы строк и другую разметку вручную.
Я мог бы написать целую связку JavaScript, чтобы проверить и ограничить тег <textarea> или contenteditable, но это выглядит очень подверженным ошибкам и может привести к кросс-браузерным несоответствиям. Или я делаю этот способ слишком сложным, и есть простой способ предотвратить злоупотребление?
Я уверен, что люди уже решили эту проблему раньше. Что мне здесь не хватает? Действительно ли мне нужно чрезвычайно сложное JavaScript решение для ввода текста с возможностью переноса в одну строку?
Кстати, я использую tiptap в качестве компонента редактора. Я знаю, что он может вводить заголовок , но до сих пор я не понял, как извлечь этот заголовок. Я хочу, чтобы он хранился отдельно от текста, а не как часть текста. Если у кого-то есть мнения относительно использования подсказок для решения моей проблемы, это также будет квалифицироваться как ответ - хотя я думаю, что использовать полнофункциональный редактор richtext для простой, неформатированной однострочной строки немного излишне. Я бы предпочел более легкие решения.