Динамическое добавление текстового маркера в текстовую область

Question

У меня есть форма, которая создается довольно динамически на основе проекта, созданного в Pageflex Studio.Я могу добавить элементы script или HTML над текстовой областью, и я могу добавить элементы script или HTML под текстовой областью, но я не могу напрямую редактировать текстовую область HTML.

По сути, у меня есть текстовая область, которая была динамически добавлена, чтоЯ могу только предназначаться, используя селектор JQuery.Мне нужно добавить какую-то функциональность к этому (либо кнопку, которую пользователь может нажать, либо просто нажав клавишу ввода), где пользователь может создать текстовую маркировку (а не пулю, созданную с помощью HTML ul / li).

Поэтому я хочу, чтобы конечный результат выглядел примерно так:

Я пытался использовать код, найденный в в этом ответе , нобыли проблемы с получением доступа к текстовой области.Я немного заржавел в своем JavaScript, поэтому я чувствую, что упускаю что-то простое здесь, но просто не понимаю.

Answer 1

Вы можете изменить любой размер маркера, скопировать [⬤, ●, •] и установить код

$("#btn_add").click(function(){
document.getElementById('todolist').value +='● ' + $("#entryText").val()+"\n";
});

#todolist {width:100%;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input placeholder="enter todo value" id="entryText" />
<button id="btn_add">add</button>

    <textarea id="todolist" class="todolist" name="todolist" rows="10" placeholder="Maintain your pending tasks"></textarea>

введите описание изображения здесь