Question

<select id="mg_sport_game_id1">
   <option value="">Select</option>
   <option value="25">Titans</option>
   <option value="35">Batman</option>
</select>

现在我必须获取上述下拉菜单的值，并将其值，文字追加到其他下拉菜单

<select id="schedule_winner">
   <option value="">Select</option>
</select>

我正在尝试如下

var team1=$("#mg_sport_game_id1").val();
var myOptions = {
    guest_name : guest,
    ($("#mg_sport_game_id1").options[$("#mg_sport_game_id1").selectedIndex].text) : team1
};

$.each(myOptions, function(val, text) {
    $('#schedule_winner').append( new Option(text,val) );
});

我最终遇到以下错误：

SyntaxError：无效的属性id

Answer 1

我不确切地知道你想要做什么，但也许这可以帮到你：

$('#mg_sport_game_id1').on('change', function() {

  var val = $(this).val(),
    text = $(this).find("option:selected").text();

  $('#schedule_winner').append(new Option(text, val));

});

我在这做什么：

注册更改事件的事件处理程序
从所选选项中获取值和文本。
将新选项附加到其他select

Example

Answer 2

我想将第一个选择的所有选项复制到您不必使用each()功能的第二个选项，只需复制html代码：

$('#schedule_winner').html($('#mg_sport_game_id1').html());

如果您想使用each()方法：

$('#mg_sport_game_id1 option').each(function(){
    $('#schedule_winner')
          .append('<option value="'+$(this).val()+'">'+$(this).text()+'</option>');
})

希望这有帮助。

＆＃13;

$('#schedule_winner').html($('#mg_sport_game_id1').html());

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="mg_sport_game_id1">
   <option value="">Select</option>
   <option value="25">Titans</option>
   <option value="35">Batman</option>
</select>

<select id="schedule_winner">
   <option value="">Select</option>
</select>

＆＃13;

Answer 3

即使这样也行，

$(document).ready(function(){
$('#mg_sport_game_id1').change(function(){
    $('#schedule_winner').append(new Option(this.options[this.selectedIndex].text, this.options[this.selectedIndex].value));
});
});

动态地将下拉列表的值文本附加到另一个下拉列表

3 个答案: