如何使用jquery实现选项选择


How to make option select selected by jquery

这是我的HTML。

<select class="height_selected" id="renderHeight">
    <option>Select Height</option>
    <option value="1">123 cm</option>
    <option value="2">125 cm</option>
</select>

我想让选项2,即125厘米作为选择。

我试着

$('#1 :selected').text();

但它不起作用。

如何选择选项125,即选择#1的值

更新我有另一个选项选择

我只想设置要选择的高度。

<select class="weight_selected" id="renderWeight">
    <option>Select Weight</option>
    <option value="1">100 kg</option>
    <option value="2">125 kg</option>
</select>

使用prop选择option

$('#renderHeight option[value="2"]').prop('selected', true);
<<p> 代码演示/strong>

$('option[value="2"]').prop('selected', true);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<select class="height_selected" id="renderHeight">
  <option>Select Height</option>
  <option value="1">123 cm</option>
  <option value="2">125 cm</option>
</select>

您也可以使用val()设置该值。

$('#renderHeight').val(2);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<select class="height_selected" id="renderHeight">
  <option>Select Height</option>
  <option value="1">123 cm</option>
  <option value="2">125 cm</option>
</select>

试试这个:要使选项被选中,可以直接将选择框的value设置为要被选中的选项的值。

$(function(){
  $('#renderWeight').val('2');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select class="weight_selected"  id="renderWeight">
<option>Select Weight</option>
<option value="1">100 kg</option>
<option value="2">125 kg</option>
</select>

可以通过传递选项值

来使用val()

现场演示

$('#renderHeight').val(2);

您可以试试下面的代码

$('#renderHeight option').each(function(){
  if($(this).text() =='123 cm'){
    $(this).prop('selected',true)
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="height_selected"  id="renderHeight">
<option>Select Height</option>
<option value="1">123 cm</option>
<option value="2">125 cm</option>
</select>