如何通过我的自定义值在 HTML 中设置 SELECT OPTION？ [复制]

Question

这个问题在这里已经有了答案：

按值设置选择选项“已选择” （26 个回答）

1 年前关闭。

我有一个选择字段，其中包含一些选项。 现在我需要使用 jQuery 选择这些选项之一。 但是，当我只知道必须选择的选项的值时，我该怎么做呢？

我有以下 HTML：

 <div class="id_100"> <select> <option value="val1">Val 1</option> <option value="val2">Val 2</option> <option value="val3">Val 3</option> </select> </div>

我试图用标签来做到这一点，但这不起作用。

请告诉我其他方式。

提前致谢

Answer 1

不确定您是否在询问选择选项的 jQuery 选择器。 如果是这种情况，请检查下面的代码段。

例子：

$('select option[value="VALUE_YOU_WANT_TO_SELECT"]')

 $(document).ready(function() { //selects the inner html of the second option tag console.log($('.id_100 option[value="val2"]').html()); //OR console.log($('select option[value="val2"]').html()); //OR only console.log($('option[value="val2"]').html()); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="id_100"> <select> <option value="val1">Val 1</option> <option value="val2">Val 2</option> <option value="val3">Val 3</option> </select> </div>

如果要将选择更改为特定选项，则可以使用以下命令：

 $(document).ready(function() { //changes selected value to the third one using the value of the jQuery selector of the thir option $('select').val($('option[value="val3"]').val()); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="id_100"> <select> <option value="val1">Val 1</option> <option value="val2">Val 2</option> <option value="val3">Val 3</option> </select> </div>

Answer 2

我很确定我的理解，但我会尝试！

我认为最好的方法是为每个选项添加一个 id 属性，但其值与 value 属性相同： <option value="val1" id="val1">Val 1</option>

因为在此之后，我们可以将您已经知道的值存储在这样的变量中：

var data = "val3"; //or whatever you had 

在 JQuery 中，我们可以这样做： $('#'+data).attr('selected', 'selected');

通过这个，我们将 selected 属性添加到我们要选择的元素中，并添加 selected 值。

希望这可以帮助 ！