Html <select> 标签上的 value 属性未选择默认选项
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5589629/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
value attribute on <select> tag not selecting default option
提问by crazy2be
Perhaps i'm misunderstanding here, but given the following html:
也许我在这里误解了,但鉴于以下 html:
<select value="2">
<option value="1">Something</option>
<option value="2">Something else</option>
</select>
I would expect "Something else" to be the default selected option. However, it does not seem to be. Why is this, and what should I be doing differently?
我希望“其他东西”是默认选择的选项。然而,似乎并非如此。为什么会这样,我应该怎么做?
采纳答案by uncaught_exceptions
The only way to have a default option is to have selected in the option tag.
拥有默认选项的唯一方法是在选项标签中选择。
<SELECT>
<OPTION>Something
<OPTION SELECTED>Something Else
回答by Genzer
You use selected
attribute on an option
element to specify default option.
您可以selected
在option
元素上使用属性来指定默认选项。
<select>
<option value="1">Something</option>
<option value="2" selected="selected">Something else</option> // this is default
</select>
回答by kojow7
React JS
反应 JS
Some coding implementations such as ReactJS allow you to use a value
attribute with the <select>
tag so this would be perfectly valid code:
一些编码实现(例如 ReactJS)允许您使用value
带有<select>
标签的属性,因此这将是完全有效的代码:
<select value="2">
<option value="1">Something</option>
<option value="2">Something else</option>
</select>
So if you are seeing code examples like this it is likely because it is in React or other similar library/framework.
因此,如果您看到这样的代码示例,很可能是因为它在 React 或其他类似的库/框架中。
HTML with Attribute Minimization:
具有属性最小化的 HTML:
Of course, typically you would want to specify the value in state, so that it is updateable.
当然,通常您会希望在 state 中指定值,以便它可以更新。
However, if you are using purely HTML you must use the selected
attribute in your <option>
tag as follows:
但是,如果您使用纯 HTML,则必须selected
在<option>
标签中使用该属性,如下所示:
<select>
<option value="1">Something</option>
<option value="2" selected>Something else</option>
</select>
HTML with Full Attribute Specification:
具有完整属性规范的 HTML:
The above uses attribute minimization, but you can also specify the full form if you want:
上面使用了属性最小化,但如果需要,您也可以指定完整形式:
<select>
<option value="1">Something</option>
<option value="2" selected="selected">Something else</option>
</select>
回答by mu is too short
The <select>
element does not have a value
attribute so that is ignored. So, you have a single selection <select>
and none of its <option>
elements have the selected
attribute, that means that the first <option>
is taken as the default selection.
该<select>
元素没有value
属性,因此被忽略。因此,您只有一个选择<select>
并且其<option>
元素都没有该selected
属性,这意味着第一个<option>
被视为默认选择。
回答by Emlyn Price
I know this post is quite old but in case anyone else is struggling with this you can implement the functionality you are looking for using jquery.
我知道这篇文章已经很老了,但如果其他人对此有困难,您可以使用 jquery 实现您正在寻找的功能。
The full code using php would be something like this
使用 php 的完整代码是这样的
PHP
PHP
if ($_SERVER['REQUEST_METHOD']== "POST") {
$thing = $_POST['things'];
} else {
$thing ="";
}
HTML
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
This will allow the select options chosen by the user to remain selected after the page has re-loaded via post instead of returning to the default values.
这将允许用户选择的选项在页面通过 post 重新加载后保持选中状态,而不是返回到默认值。