<select>标签上的value属性未选择默认选项</select>

Question

也许我在这里误解了，但是给出了以下的html：

<select value="2">
    <option value="1">Something</option>
    <option value="2">Something else</option>
</select>

我希望“别的东西”成为默认的选择选项。但是，它似乎不是。为什么会这样，我应该做些什么呢？

Answer 1

您在selected元素上使用option属性来指定默认选项。

<select>
    <option value="1">Something</option>
    <option value="2" selected="selected">Something else</option> // this is default
</select>

select elements do not have a value attribute.

Answer 2

拥有默认选项的唯一方法是在选项标签中选择。

<SELECT>
<OPTION>Something
<OPTION SELECTED>Something Else

Answer 3

<select>元素没有value属性，因此会被忽略。因此，您只有一个选择<select>且其<option>个元素都没有selected属性，这意味着第一个<option>被视为默认选择。

Answer 4

React JS

某些编码实现（如ReactJS）允许您使用带有value标记的<select>属性，因此这将是完全有效的代码：

<select value="2">
    <option value="1">Something</option>
    <option value="2">Something else</option>
</select>

因此，如果您看到这样的代码示例，可能是因为它位于React或其他类似的库/框架中。

带属性最小化的HTML：

当然，通常你会想要在状态中指定值，以便它可以更新。

但是，如果您使用的是纯HTML，则必须使用selected标记中的<option>属性，如下所示：

<select>
    <option value="1">Something</option>
    <option value="2" selected>Something else</option>
</select>

具有完整属性规范的HTML：

以上使用属性最小化，但您也可以根据需要指定完整表单：

<select>
    <option value="1">Something</option>
    <option value="2" selected="selected">Something else</option>
</select>

Answer 5

我知道这篇文章已经很老了，但是如果其他人正在努力解决这个问题，你可以使用jquery来实现你正在寻找的功能。

使用php的完整代码将是这样的

<强> PHP

if ($_SERVER['REQUEST_METHOD']== "POST") {
$thing = $_POST['things'];
} else {
$thing ="";
}

<强> HTML

<select name='things' value="<?php echo $thing; ?>">
    <option value="1">Something</option>
    <option value="2">Something else</option>
</select>

JQUERY

$(function() {
    $("select[value]").each(function() {
        $(this).val(this.getAttribute("value"));
    });
}); //end document ready

这将允许用户选择的选择选项保持选中状态 页面通过post重新加载而不是返回后 到默认值。

Answer 6

您必须使用select属性。在下面的代码中，默认情况下将选择一个快捷选项

<select name="myCar" id="car">
            <option value="ind">Indica</option>
            <option value="swf" selected>Swift</option>
 </select>