Question

在我的HTML中，我有：

<select>
    <option value></option>
    <option value="1">One</option>
    ...
</select>
<select>
    <option value></option>
    <option value="1">One</option>
    ...
</select>
<select>
    <option value></option>
    <option value="1">One</option>
    ...
</select>
...

所有选择的标签都没有ID或类我想设置第一个选项的文本

例如：

<select>
    <option value>My Text</option>
    <option value="1">One</option>
</select>
<select>
    <option value>My Text</option>
    <option value="1">One</option>
</select>
...

如何使用jQuery执行此操作？

Answer 1

使用 :first-child 伪类选择器获取第一个选项，并使用 text() 方法更新文本内容。

$('select option:first-child').text('My text')

$('select option:first-child').text('My text')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value></option>
  <option value="1">One</option>
</select>

<select>
  <option value></option>
  <option value="1">One</option>
</select>

<select>
  <option value></option>
  <option value="1">One</option>
</select>

Answer 2

＆＃13;

$('select option:nth-child(1)').text('My Text')

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option value></option>
<option value="1">One</option>
...
</select>

<select>
<option value></option>
<option value="1">One</option>
...
</select>

<select>
<option value></option>
<option value="1">One</option>
...
</select>

...

＆＃13;

使用:nth-child(1)获取第一个选项
使用.text()设置文字

Answer 3

需要创建一个公共函数，我们必须传递下拉列表的id和我们要为下拉列表的第一个选项添加的文本。请查看下面的代码。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<select id="first">
<option value></option>
<option value="1">One</option>
...
</select>

<select id="second">
<option value></option>
<option value="1">One</option>
...
</select>

<select  id="third">
<option value></option>
<option value="1">One</option>
...
</select>

<script type="text/javascript">
    function firstValueSelect(id,value){
        $('#'+id+' option:first-child').text(value);
    }
    firstValueSelect("first","test first");
    firstValueSelect("second","test second");
</script>

将文本添加到所有第一个菜单选项

3 个答案: