Скопировать данные меню выпадающего меню в текстовое поле на выбор?

Question

Допустим, у вас есть это ниспадающее меню:

<select> 
    <option value="10">Apple</option> 
    <option value="20">Orange</option> 
</select> 

<input type="name" /> 
<input type="price" /> 

Если пользователь выбирает «Orange» из выпадающего меню, значения текстовых полей должны быть:

<input type="name" value="Orange" /> 
<input type="price" value="20" /> 

или если он был „Apple“, то значения текстовых полей должны быть Apple и 10.

Возможно ли это с JQuery или JQuery Mobile, если да, то как?

Answer 1

http://jsfiddle.net/f23uP/

$('select').change(function(){ 

$('input[type=name]').val($('option:selected',this).text()); 
    $('input[type=price]').val($(this).val()); 
}); 

Answer 2

Да

$("select").change(function() { 
    var price = this.value; 
    var selText = $("select option:selected").text(); 

    $("input[type='name']").val(selText); 
    $("input[type='price']").val(price); 
}); 

Нечто подобное должно работать

Answer 3

JQuery:

$("#s").on("change",function(){ 
    $("#text").val($(this).children().filter("option:selected").text()); 
    $("#price").val($(this).val()); 
}); 

Markup:

<select id="s"> 
    <option value="10">Apple</option> 
    <option value="20">Orange</option> 
</select> 

<input type="text" id="text" /> 
<input type="text" id="price" /> 

jsFiddle: http://jsfiddle.net/hescano/NnsDt/

Answer 4

Я думаю, что вы немного запутался с типами входов. Это поможет MDN link.

Если вы правильно поняли, вы хотите взять значение и метку из списка и сохранить их в соответствующем текстовом поле. Вот мое решение:

HTML:

<select id="fruit"> 
    <option></option> 
    <option value="10">Apple</option> 
    <option value="20">Orange</option> 
</select> 

<input type="text" id="name" /> 
<input type="text" id="price" /> 

JQuery:

$("#fruit").change(function() { 
    var name = $(this).find(":selected").text(); 
    var price = $(this).val(); 
    $("#name").val(name); 
    $("#price").val(price); 
}); 

Обратите внимание, что это Jquery только связывает плод select для OnChange вместо связывания всех select