Скопируйте значение идентификатора опции выбора в скрытое поле с помощью jQuery

Question

Я видел несколько учебных пособий, в которых вы можете скопировать значение параметра select в скрытое поле, например:

$("#my_stuff").change(function(){
    $("#my_hidden_field").val($("select option:selected").val());
});

Так что, если бы у меня было это ...

<select name="my_stuff" id="my_stuff">
    <option value="Red">Red things</option>
    <option value="Green">Green things</option>
    <option value="Blue">Blue things</option>
</select>

... и выберите «Красные вещи», тогда «Красные вещи» будут скопированы в значение скрытого поля.

Но что мне действительно нужно сделать , так это скопировать ID , поэтому, если бы у меня было это ...

<select name="my_stuff" id="my_stuff">
    <option value="Red" id="all the red stuff">Red things</option>
    <option value="Green" id="all the green stuff">Green things</option>
    <option value="Blue" id="all the blue stuff">Blue things</option>
</select>

... и я выбрал «Красные вещи», тогда «все красные вещи» будут скопированы в скрытое поле.

Это вообще возможно?

Answer 1

Альтертанитева путь:

$("#my_stuff").change(function(){
   $("#my_hidden_field").val($("select option:selected").prop('id'));
});

Answer 2

Это очень просто: Вот, пожалуйста:

$("#my_stuff").change(function(){
    $("#my_hidden_field").val($("select option:selected").attr('id'));
});

Answer 3

Если вы хотите получить id вместо value , тогда добавьте .attr('id') вместо .val()

$("#my_stuff").change(function(){
    $("#my_hidden_field").val($("select option:selected").attr('id'));
});

Answer 4

Конечно.

$("#my_stuff").change(function(){
    $("#my_hidden_field").val($(this).children(":selected").attr('id'));
});

Обратите внимание, что вы теряете связь между select, который инициировал событие, и select, который вы запрашиваете, чтобы получить выбранное значение. Изменения:

$("select option:selected") //any select, not necessarily the event trigger

до

$(this).children(":selected") //specifically, the select that triggered the event

Обратите внимание, что в первом примере вам не нужно переходить к выбранному option и получать его значение ; jQuery достаточно умен, чтобы, если вы просто запросите .val() на самом select, он сделает это за вас.

$("#my_stuff").change(function(){
    $("#my_hidden_field").val($(this).val());
});