javascript - 如何用jquery填充选择框？

Question

我有一个要求，当我单击列表中的某个元素时，该元素将在选择框中显示为选定选项

我只需要使用 native 选择框，更不用说列表中的元素出现在选择下拉列表中

<button class="quick">QuickLink</button>

<div class="list">
<ul class="apps">
    <li>CAPM</li>
    <li>GCS</li>
    <li>GRS</li>
</ul>
</div>

<select class="xyz">
<option>CAPM</option>
<option>GRS</option>
<option>BDS</option>
<option>CCAS</option>
<option>WEDAT</option>
<option>SDP</option>
</select>

jsfiddle 链接 --> https://jsfiddle.net/8s31w4t9/

Answer 1

将click事件与li绑定(bind)并使用以下方法:

1. .text()

   Get the combined text contents of each element in the set of matched elements, including their descendants, or set the text contents of the matched elements.

2. .val( value )

   Set the value of each element in the set of matched elements.

代码

$('.apps li').click(function () {
    //Get the text of clicked element
    var text = $(this).text();

    //Set the value of select 
    $('.xyz').val(text);
});

DEMO