如何使用javascript选择选择选项？ [复制]

Posted 2023-03-05

【中文标题】如何使用javascript选择选择选项？ [复制]

【英文标题】：How to choose select option with javascript? [duplicate]

【发布时间】：2016-02-19 21:09:44

【问题描述】：

我有一个 html 选择选项

<select id="level" name="level" class="ui dropdown">
   <option value="">Choose</option>
   <option value="1">Abc</option>
   <option value="2">Def</option>
   <option value="3">ghk</option>
</select>

当我加载这个 HTML 时，我需要选择选项（基于 DB 提供的数据）。

$(document).ready(function(e) 
    var selectedIndex=3; //This data i get from DB
    //now i need to select option in select.

);

那么如何根据value将selected分配给option呢？

运行示例：http://jsfiddle.net/o850tw9L/

【问题讨论】：

那你为什么用jquery标记呢？

因为我不知道我是否只能使用 javascript 来做到这一点。

jQuery 是一个框架，一个用 javascript 制作的库。原生 javascript 也可以用 jQuery 做任何事情。

一个快速的谷歌搜索想出了这个例如：w3schools.com/jsref/prop_select_selectedindex.asp

请在提问前使用搜索。

【参考方案1】：

试试这个..

document.getElementById('sel').value = '2';​​​​​​​​​​

<select id="sel">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

演示：http://js.do/code/73755

【参考方案2】：

您可以使用val() 通过value 属性选择一个选择的option：

$('#level').val('3');

或者，如果您更喜欢通过selectedIndex 执行此操作，正如您的变量名称所暗示的那样，您可以使用eq() 方法：

$('#level option:eq(3)').prop('selected', true);

Updated fiddle

【参考方案3】：

在纯 JS 中你可以这样做：

var element = document.getElementById('level');
element.value = selectedIndex;

希望这会有所帮助！

【参考方案4】：

看到这个问题：HTML SELECT - Change selected option by VALUE using JavaScript

我还用你的代码写了一个例子：

document.getElementById('level').value = 2;

<select id="level" name="level" class="ui dropdown">
   <option value="">Choose</option>
   <option value="1">Abc</option>
   <option value="2">Def</option>
   <option value="3">ghk</option>
</select>

【讨论】：

如果这是重复的，请投票、标记或评论以关闭它。不要用问题的链接回答。

【参考方案5】：

像这样 (JSFiddle):

<select id="level" name="level" class="ui dropdown">
   <option value="">Choose</option>
   <option value="1">Abc</option>
   <option value="2">Def</option>
   <option value="3">ghk</option>
</select>

还有脚本：

$(document).ready(function(e) 
    var selectedIndex=3; //This data i get from DB
    //now i need to select option in select.
    document.getElementById('level').value=selectedIndex;


);

【参考方案6】：

使用jQuery你可以选择选项，见下面的代码

$(document).ready(function(e) 
    var selectedIndex=3; //This data i get from DB
    //now i need to select option in select.
    $('#level').val(selectedIndex);
);

JSFIddle Demo with jQuery

JSFiddle Demo with Javascript

【参考方案7】：

你可以像这样用jquery做到这一点，

$(document).ready(function (e) 
    $("#level").val("3");
);

使用javascript，

document.getElementById('level').value="3";

Fiddle