отобразить выбранный элемент из выпадающего onchange функции в HTML-метку через JavaScript, пожалуйста, помогите, как это сделать

Question

<form  method="post">
  <select name="users" id="users" onchange="showUser(this.value)" value="">
    <option value="">Select a person:</option>
    <option value="1" onchange="copy();">tcs</option>
    <option value="2" onchange="copy();">wipro</option>
    <option value="3" onchange="copy();">Hcl</option>
    <option value="4" onchange="copy();">krystal kones</option>
  </select>
</form>

У меня есть этот выпадающий список, я хочу, чтобы при изменении значения, например, tcs, wipro или hcl, это значение отображалось в метке html

Answer 1

Попробуйте добавить атрибут onChange в тег select.

Пример: http://jsfiddle.net/r6Fus/

HTML:

<div id="label"></div>
<select id="mySelect" onchange="copy();">
    <option value="">Select a person:</option>
    <option value="tcs" >tcs</option>
    <option value="wipro" >wipro</option>
    <option value="Hcl" >Hcl</option>
    <option value="krystal kones" >krystal kones</option>
</select>

JavaScript:

function copy() {
    document.getElementById("label").innerHTML = document.getElementById("mySelect").value
}

В противном случае вы можете использовать jQuery .

Answer 2

Прежде всего, событие onchange относится к элементу select, а не к элементам option. Они на самом деле не меняются. Кроме того, у вас есть две функции JavaScript. showUser() и copy(). Но вы описываете только одну часть функциональности. Что делают эти две функции?

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

$(document).ready(function() {
  $('#users').change(function() {
    $('#myLabel').text($(this).val());
  });
});

Что это в основном делает:

1. Подождите, пока DOM не будет загружен и готов.
2. Привязать функцию к событию change указанного элемента select.
3. Функция содержит одну строку, которая устанавливает текст указанной метки в значение select.