更改选项的文本属性

Question

尝试使用选项的值作为变量来更改其文本属性。

我的尝试没有用，请帮忙。

预期结果是：

<option value = 2>earth</option>

var x = 2
var str = 'earth';

$('button').on('click', function(){
$('#sela:option[value = ' + x + ']').attr('text', str); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id='sela'>
<option value = 1>lorem</option>
<option value = 2>ipsum</option>
</select>
<br><br>
<button>CLICK</button>

Answer 1

您必须使用$('#sela>option[value = ' + x + ']')来选择option的直接#sela子级。

然后使用text()更新选项文本。

var x = 2
var str = 'earth';

$('button').on('click', function() {
  $('#sela>option[value = ' + x + ']').text(str);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select id='sela'>
  <option value=1>lorem</option>
  <option value=2>ipsum</option>
</select>
<br><br>
<button>CLICK</button>