我认为在下面的<select>元素上添加一个“value”属性集会导致默认选择包含我提供的“value”的<option>:

<select name=“hall”id=“hall”value=“3”><option>1</option><option>2</option><option>3</option><选项>4</选项><选项>5</选项></选择>

然而,这并没有像我预期的那样奏效。我如何设置默认选择哪个<option>元素?


当前回答

我更喜欢这样:

<select>
   <option selected hidden>Choose here</option>
   <option value="1">One</option>
   <option value="2">Two</option>
   <option value="3">Three</option>
   <option value="4">Four</option>
   <option value="5">Five</option>
</select>

选择选项后,“选择此处”消失。

其他回答

如果将select与angular 1一起使用,则需要使用nginit,否则,将不会选择第二个选项,因为ng-model会覆盖默认的选定值

<select ng-model="sortVar" ng-init='sortVar="stargazers_count"'>
  <option value="name">Name</option>
  <option selected="selected" value="stargazers_count">Stars</option>
  <option value="language">Language</option>
</select>

如果处于react状态,则可以使用defaultValue作为属性,而不是select标记中的值。

我就是这样做的。。。

<form action="../<SamePage>/" method="post">

<?php
    if ( $_POST['drop_down'] == "")
    {
    $selected = "";
    }
    else
    {
    $selected = "selected";
    }
?>

<select name="select" size="1">

  <option value="1" <?php $selected ?>>One</option>
     ////////  OR  ////////
  <option value="2" $selected>Two</option>

</select>
</form>

默认选定值为选项-4

  <html:select property="status" value="OPTION_4" styleClass="form-control">
            <html:option value="">Select</html:option>
            <html:option value="OPTION_1"  >Option-1</html:option>
            <html:option value="OPTION_2"  >Option-2</html:option>
            <html:option value="OPTION_3"  >Option-3</html:option>
            <html:option value="OPTION_4"  >Option-4</html:option>
            <html:option value="OPTION_5"  >Option-5</html:option>                                  
   </html:select>

<select>的问题是,它有时与当前渲染的状态断开连接,除非选项列表中发生了更改,否则不会返回更改值。当试图从列表中选择第一个选项时,这可能是一个问题。下面的代码可以获得第一次选择的第一个选项,但onchange=“changeFontSize(this)”本身不会。上面描述了一些方法,使用伪选项强制用户更改值以拾取实际的第一个值,例如使用空值开始列表。注意:onclick将调用该函数两次,以下代码没有调用,但解决了第一次出现的问题。

<label>Font Size</label>
<select name="fontSize" id="fontSize" onfocus="changeFontSize(this)" onchange="changeFontSize(this)">           
    <option value="small">Small</option>
    <option value="medium">Medium</option>
    <option value="large">Large</option>
    <option value="extraLarge">Extra large</option>
</select>

<script>
function changeFontSize(x){
    body=document.getElementById('body');
    if (x.value=="extraLarge") {
        body.style.fontSize="25px";
    } else {
        body.style.fontSize=x.value;
    }
}
</script>