Параметр HTML <select> для заполнения текстового поля содержимым HTML
Я использовал приведенный ниже код, найденный на JSFiddle, который отлично работает, но когда я реализую его с помощью своего кода, который представляет собой текстовую область, поддерживающую HTML, похоже, что он не работает. Это код, в который я хочу его реализовать, но он не работает. Кто-нибудь может посоветовать? Мой код:
<div text-angular = "text-angular" name = "htmlcontent" ng-model = "htmlcontent" ta-disabled='disabled'></div>
<p>
<textarea type = "text" id = "message" ng-model = "htmlcontent" required = "required" style = "display: none;" name = "message" required /></textarea>
</p>
JSFIDDLE HTML:
<select id = "dropdown">
<option value = "">None</option>
<option value = "text1">text1</option>
<option value = "text2">text2</option>
<option value = "text3">text3</option>
<option value = "text4">text4</option>
</select>
JSFIDDLE JS:
var mytextbox = document.getElementById('mytext');
var mydropdown = document.getElementById('dropdown');
mydropdown.onchange = function(){
mytextbox.value = mytextbox.value + this.value;
}
Любой совет будет очень признателен?
Когда я нажимаю одну из опций раскрывающегося списка, текстовая область не заполняется. Я думаю, это связано с текстом Angular
ты делаешь в угловом?
Использование text-angular для создания текстовой области, кроме ввода html?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Вам нужно получить значение от события так:
mydropdown.onchange = function(e){
mytextbox.value = mytextbox.value + e.value;
}
Значит, JS должен быть таким? var mytextbox = document.getElementById ('mytext'); var mydropdown = document.getElementById ('раскрывающийся список'); mydropdown.onchange = функция (e) {mytextbox.value = mytextbox.value + e.value; }
чтобы получить доступ к раскрывающемуся значению элемента, используйте это
mydropdown.options[mydropdown.selectedIndex].value;
и когда вы объединяете текстовую область, добавьте пространство для хорошего просмотра
mytextbox.value = mytextbox.value +' '+ mydropdownValue;
посмотреть код
var mytextbox = document.getElementById('message');
var mydropdown = document.getElementById('dropdown');
mydropdown.onchange = function() {
var mydropdownValue = mydropdown.options[mydropdown.selectedIndex].value;
mytextbox.value = mytextbox.value + ' ' + mydropdownValue;
}My Code:
<div text-angular = "text-angular" name = "htmlcontent" ng-model = "htmlcontent" ta-disabled='disabled'></div>
<p>
<textarea type = "text" id = "message" ng-model = "htmlcontent" required = "required" style = "display: block;" name = "message" required /></textarea>
</p>
</div>
HTML JSFIDDLE:
<select id = "dropdown">
<option value = "">None</option>
<option value = "text1">text1</option>
<option value = "text2">text2</option>
<option value = "text3">text3</option>
<option value = "text4">text4</option>
</select>Спасибо, но я включил приведенный выше код, но у меня он не работает. Я думаю, что текстовая область, поддерживающая HTML, или текст Angular вызывает проблему. Вы можете посоветовать?
ваш идентификатор текстовой области - «сообщение», вам нужно вызвать это, когда в вашем JS напишите «document.getElementById», например, этот document.getElementById («message»);
Да, я это изменил. Это не проблема
var text = document.getElementById('message');
var drop = document.getElementById('dropdown');
drop.addEventListener('change',function(e){
text.value += ' ' + e.target.value;
//OR ` ${e.target.value}`
})<div text-angular = "text-angular" name = "htmlcontent" ng-model = "htmlcontent" ta-disabled='disabled'></div>
<p>
<textarea type = "text" id = "message" ng-model = "htmlcontent" required = "required" style = "display: block;" name = "message" required /></textarea>
</p>
</div>
<select id = "dropdown">
<option value = "">None</option>
<option value = "text1">text1</option>
<option value = "text2">text2</option>
<option value = "text3">text3</option>
<option value = "text4">text4</option>
</select>
Опишите "не работает"?