Question

我有下拉（选择）框喜欢：

<select name="drp_name" id="drp_name">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>

我希望得到所有选项值并在任何div中写（打印），如：

<div id="main_div">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</div>

Answer 1

非常简单：

$('#drp_name option').map(function() {
    return $('<div />', {text: $(this).text()}).get(0); // or this.value / $(this).val()
}).appendTo('#main_div');

参考：.map，.appendTo

DEMO

Answer 2

$('#main_div').empty();
$('#drp_name option').each(function() {
  $('#main_div').append('<div>'+ $(this).text() +'</div>');
});

<强> DEMO

如果div中的#main_div以前存在，那么

$('#drp_name option').each(function(index, item) {
  $('#main_div div').eq(index -1).html($(this).text());
});

或

$('#main_div').empty();
$('#drp_name option').filter(function() {
  $('#main_div').append('<div>'+ $(this).text() +'</div>');
});

<强> DEMO

注意如果您需要value，请使用this.value。

Answer 3

var div = $('#main_div').empty();
$('#drp_name > option').each(function() {
    $('<div/>').text($(this).text()).appendTo(div);
});

如果您不想要选项的文字而是值，请将$(this).text()替换为this.value。

如何获取所有值的下拉（选择框）并在任何div中写入

3 个答案: