【问题标题】:How to set default value for HTML select? [duplicate]如何设置 HTML 选择的默认值? [复制]
【发布时间】:2013-11-05 20:29:09
【问题描述】:

我有一个这样的 HTML 选择:

<select>
    <option>a</option>
    <option>b</option>
    <option>c</option>
</select>

我的 JavaScript 中有一个名为 temp 的变量:

var temp = "a";

现在我想将等于 temp 的选项的值设置为我的选择的默认值。

我该怎么做?

【问题讨论】:

  • 我想你的意思是动态的?
  • @InGodITrust:是的,完全正确。

标签: javascript html


【解决方案1】:

您首先需要为您的select 选项添加值,并且为了便于定位,给select 本身赋予id

让我们将选项 b 设为默认值:

<select id="mySelect">
    <option>a</option>
    <option selected="selected">b</option>
    <option>c</option>
</select>

现在您可以使用 JavaScript 更改默认选定值,如下所示:

<script>
var temp = "a";
var mySelect = document.getElementById('mySelect');

for(var i, j = 0; i = mySelect.options[j]; j++) {
    if(i.value == temp) {
        mySelect.selectedIndex = j;
        break;
    }
}
</script>

我们也可以使用 i 的“text”属性来验证:

如果(i.text == temp)

codepen 上查看它的实际效果。

【讨论】:

  • +1 以获得最完整的答案和提供的工作示例!
  • +1 用于使用 javascript; “接受”的答案使用 jQuery。
  • 这绝对是正确的答案。虽然 codepen 有一个错误 - 使用 a ,它应该有一个 ;这个虽然有效codepen.io/anon/pen/LEVjvr
  • 感谢您指出这一点@ovann86。我更新了 codepen 示例。
  • 您能否扩展您对 Html 助手的回答?例如:@Html.DropDownListFor(Function(Model) Model.ReportId, New SelectList(Model.allReports, "ReportID", "ReportName", New With {.class= "form-control", .id = "ReportID"} ), "选择报告...")
【解决方案2】:

注意:这是 JQuery。参见 Sébastien 对 Javascript 的回答

$(function() {
    var temp="a"; 
    $("#MySelect").val(temp);
});

<select name="MySelect" id="MySelect">
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
</select>

【讨论】:

    【解决方案3】:

    你应该定义option的属性,比如selected="selected"

    <select>
       <option selected="selected">a</option>
       <option>b</option>
       <option>c</option>
    </select>
    

    【讨论】:

      【解决方案4】:

      Simplay 你可以将 HTML select 属性放到选项a 中,如下所示

      定义像selected="selected"这样的属性

      <select>
         <option selected="selected">a</option>
         <option>b</option>
         <option>c</option>
      </select>
      

      【讨论】:

        【解决方案5】:

        你可以定义属性 selected="selected" 在 前一个

        【讨论】:

          【解决方案6】:

          你可以使用...

          <option <?= ($temp == $value) ? "SELECTED" : "" ?> >$value</opton>
          

          编辑:我以为我在看 PHP 问题...抱歉。

          【讨论】:

            猜你喜欢
            • 2015-07-23
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2018-12-05
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多