CS50 Finance中如何避免select菜单option的value与innerHTML硬编码

问题原因 #

你遇到的问题是Jinja2模板的变量输出语法使用错误：

• 模板内直接写的sym = row["symbol"]不属于合法的模板逻辑/变量输出写法，Jinja不会解析这行内容，只会原样输出到HTML源码中
• 你写在<option>的value属性和内部文本里的sym都是普通静态字符串，没有绑定模板变量，所以渲染后固定显示为sym
• 另外{% for row in stocks %}}末尾多写了一个右花括号，属于语法瑕疵，也可能引发渲染异常

解决方案 #

删掉冗余的sym赋值行，用Jinja的变量输出语法{{ 变量 }}包裹需要动态输出的内容即可，不需要额外用JS动态设置，服务端渲染阶段就能直接生成正确的下拉选项。
修正后的完整代码如下：

<select name="symbol">
    {% for row in stocks %}
    <option value="{{ row['symbol'] }}">{{ row['symbol'] }}</option>
    {% endfor %}
</select>

内容的提问来源于stack exchange，提问作者edithzxin