selectize: получить текст и значение из нескольких элементов selectize

Question

Я использую несколько элементов seletize (выберите). Пользователь может выбрать один из нескольких вариантов и непосредственно перед отправкой. Я хочу показать выбранный текст (и его значение) в модальном режиме.

С помощью selectize я, кажется, могу получить значение (по val()), но я не могу получить текст (метку).

Так, например, вариант Город имеет:

<select name="city"> 
 
    <option value="1"> Melbourne </option> 
 
    <option value="2"> Sydney </option> 
 
    <option value="3"> Mumbai </option> 
 
</select>

Мой создать код работает отлично, я просто хочу, чтобы получить значение и текст, так что если пользователь выбирает Мельбурн Я хочу иметь возможность получить значение = 1 и текст = Мельбурн.

Любые указатели были бы полезны.

Answer 1

Прежде всего, это не создает несколько selectbox.

Создайте несколько элементов selectbox следующим образом.

<select name="city" multiple="multiple" id="city"> 
    <option value="1"> Melbourne </option> 
    <option value="2"> Sydney </option> 
    <option value="3"> Mumbai </option> 
    </select> 
<button type="button" id="get_values">Show values</button> 

JS для извлечения значения и текст идет как этот

document.getElementById('get_values').onclick = function() { 
    var x=document.getElementById('city'); 
    for (var i = 0; i < x.options.length; i++) { 
     if(x.options[i].selected ==true) 
     { 
      alert(x.options[i].text); 
      alert(x.options[i].value); 
     } 
    } 
} 

Проверьте это JSfiddle http://jsfiddle.net/n0urwz9e/

Answer 2

Try это. созданная функция для выбора элемента для получения текста.

function textChanged(){ 
 
    alert($("#city").val()); 
 
    alert($("#city option:selected").text()); 
 
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="city" name="city" onChange="textChanged();"> 
 
    <option value="1"> Melbourne </option> 
 
    <option value="2"> Sydney </option> 
 
    <option value="3"> Mumbai </option> 
 
    </select>