Question

这是我动态下拉菜单的代码，我想更改第一个没有id且值为空的选项的文本！

这是代码：

<div class="my-tours">
    <select name="tours">
        <option value="">All</option>
        <option value="america">America</option>
    </select>
</div>

Answer 1

您的问题并不清楚您想要的输出。但你可以通过这样的方式改变第一个选项值：

$("#select-id option:first").attr("value", "");

Answer 2

＆＃13;

$('#tours > option:not([id])').filter(function () {
  let val = $(this).attr('value');
  return val === undefined || val === '';
}).first().text('First id-less with no value');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my-tours">
    <select name="tours" id="tours">
        <option value="mexico">Mexico</option>
        <option value="">All</option>
        <option value="america">America</option>
        <option>Nowhere</option>
    </select>
</div>

＆＃13;

我在<select>标记中添加了一个id，以便更轻松地选择它，并使DOM查询更有效。我强烈建议您这样做，但如果由于某种原因您无法添加ID，您也可以使用$('select[name="tours"]')选择它。

一步一步，这是这样做的：

$('#tours > option:not([id])')选择<option>内没有#tours属性的所有id代码。
过滤器功能会过滤掉任何值为非空的属性的选项。我必须使用一个函数来考虑两个没有值属性的选项和一个具有空值属性的选项。如果可以保证所有选项都具有值属性，则可以使用选择器.filter('[value=""]')。
.first()抓取与我们的过滤器匹配的第一个选项。
.text()设置新文字。

Answer 3

在这里。在选项选择器中使用name属性和:first。

$(document).ready(function() {
  $("select[name='tours'] option:first").text("wow");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my-tours">
  <select name="tours">
        <option value="">All</option>
        <option value="america">America</option>
    </select>
</div>

在select option value =“”处更改文本

3 个答案: