HTML 选择表单变量默认值

Question

我正在尝试为 HTML 选择表单设置默认值。我已经阅读了有关为选择表单设置常量默认值的文章。但是，我希望默认值为可变衬衫。颜色，根据衬衫的不同，颜色为小、中或大。

例如，如果衬衫。颜色很小，我希望选择表单选中"小";如果衬衫。颜色为中等，我希望选择表单选中中;如果衬衫。颜色为"大"，我希望选择窗体选中"大"。

我知道如何使用数据绑定为文本框设置默认值。我使用以下方法设置默认衬衫颜色：

<div class="form-group">
    <label class="control-label col-sm-2">Shirt Color</label>
    <input type="text" name="color" data-bind="valueUpdate: 'input', value:shirt.Color" class="form-control" required />
</div>

对于选择表单，我可以做一些同样简单的事情吗？我宁愿不手动编写小、中、大的每个案例。

我试过做

<div class="form-group">
    <label class="col-sm-2 control-label col-sm-2">Shirt Size:</label>
    <select required name="type" data-bind="type: 'input', value: shirt.Size">
        <option value="s">Small</option>
        <option value="m">Medium</option>
        <option value="l">Large</option>
    </select>
</div>

但是，这始终默认为第一个选项"小"。

Answer 1

您可以使用kendoDropDownList。

<div data-bind="kendoDropDownList: { data: shirtSizes, dataTextField: 'SizeName', dataValueField: 'SizeId', value: shirt.Size } />

其中shirtColors是包含 ColorName 和 ColorId 字段的数组。

var shirtSizess = [ { SizeId: 's', SizeName: 'Small' }, { SizeId: 'm', SizeName: 'Medium' }, { SizeId: 'l', SizeName: 'Large' } ];

Answer 2

您的问题有些模糊，所以我假设您要做的是为选择列表设置默认值。为此，只需在包含默认情况下要选择的值的选项标签中添加"selected"。下面是一个示例：

<option value="s">Small</option> <option value="m" selected>Medium</option> <option value="l">Large</option>选择列表的默认值现在为"m"。