Question

我使用bootstrap和html reset创建了一个重置按钮。它适用于IE，但不适用于Chrome和Firefox。

出于某种原因，当我重置表单时，表单中的其余字段会为所有三个浏览器重置。但是，与完全重置表单的IE不同，有一个显示里程的特定字段。

在Chrome和Firefox中，它不会显示空白英里，而是显示最后一个20英里的选项。

我不明白为什么这样做。任何帮助将不胜感激

<div class="form-group">
    <div class="input-group">
        <select class="form-control" name="distance" ng-model="searchParam.distance">
            <option selected="selected" value=" "></option>
            <option selected="selected">5</option>
            <option selected="selected">10</option>
            <option selected="selected">15</option>
            <option selected="selected">20</option>
        </select>
    
        <div class="input-group-addon">mi</div>
    </div>
</div>

<!---The reset button --->

<div class="form-group">
    <input class="btn btn-primary btn-block" type="reset" value="Reset" />    
</div>

Answer 1

仅将selected="selected"与默认option：

一起使用

<select class="form-control" name="distance" ng-model="searchParam.distance">
    <option selected="selected"></option>
    <option>5</option>
    <option>10</option>
    <option>15</option>
    <option>20</option>
</select>

＆＃13;

<form>
    <div class="form-group">
        <div class="input-group">
            <select class="form-control" name="distance" ng-model="searchParam.distance">
                <option selected="selected"></option>
                <option>5</option>
                <option>10</option>
                <option>15</option>
                <option>20</option>
            </select>

            <div class="input-group-addon">mi</div>
        </div>
    </div>

    <!---The reset button --->

    <div class="form-group">
        <input class="btn btn-primary btn-block" type="reset" value="Reset" />
    </div>
</form>

＆＃13;

请参阅JSFiddle

重置按钮不会重置选择元素

1 个答案: