html选择无法显示正确的值[关闭]

Question

在 Firefox 46.0.1 中，只有一个选择 element 和一些 option 元素。 select 值属性正在由 javascript 代码更改，并在浏览器检查器窗口中对此进行确认

<select value="G" data-id="someid">，其中一个选项是
<option value="G">G please</option>

但在控制台中：
$('select').first().val() 提供了空字符串，如 "" 中的那样，因此显示器没有按我的预期显示所选选项。

如果我发出$('select')[0].value = "R"，显示器会通过显示正确的选项值来响应。

为什么以及如何解决此问题，以便在 javascript 代码更改 select 元素的 value 属性时显示正确的选项？谢谢

<template name="select">
  <select data-id={{_id}} value={{value}}>
    {{#each values}}
      <option value={{value}}>{{caption}}</option>
    {{/each}}
  </select>
</template>

该值由 Meteor 模板助手填充。

编辑
这是来自助手的底层数据：“sample”

{
    "_id" : "SqNF9wTsbaxEhj5b4",
    "element" : "select",
    "action" : "action12",
    "values" : [
        {
            "group" : "bCode",
            "value" : "G",
            "caption" : "Select food type..."
        },
        {
            "group" : "bCode",
            "value" : "O",
            "caption" : "water"
        },
    ],
    "userId" : "uhx7rt",
    "createdAt" : 1464135235771,
    "value" : "G"
}

Answer 1

正如 charlietfl 在 cmets 中建议的那样。 我不得不放弃在select 元素上使用value 属性，而是在option 元素上使用selected 属性。

正如在另一篇文章中所建议的那样，Meteor 不允许 html 属性为空值。我必须删除未选择的选项的属性。