带有 EJS 的 HTML 选择选项

新手上路,请多包涵

我正在为我的 Web 应用程序进行配置,尝试将其呈现到网页。下面是我的代码的一部分。我想把选项选到 config[0].volume 了。因此,如果 config[0].volume 为“50”,则所选选项将为“50”。这些代码运行良好。但我想知道。 “我怎样才能缩短这段代码?”我的代码太冗长了。

 <select id="volume">

  <option value="1" <%= config[0].volume == '1' ? 'selected' : ''%>>1</option>
  <option value="5" <%= config[0].volume == '5' ? 'selected' : '' %>>5</option>
  <option value="10" <%= config[0].volume == '10' ? 'selected' : '' %>>10</option>
  <option value="50" <%= config[0].volume == '50' ? 'selected' : '' %>>50</option>
  <option value="75" <%= config[0].volume == '75' ? 'selected' : '' %>>75</option>
  <option value="100" <%= config[0].volume == '100' ? 'selected' : '' %>>100</option>

</select>

我想了大约 2 个小时,但什么也没发生。也许我必须使用 jQuery 或 JavaScript,并添加属性来拥有它,

 attr('selected')... ?

我不知道,你能帮帮我吗?

原文由 ton1 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 343
2 个回答

您可以根据选项值将其放入循环中。

 <select id="volume">

<%
var options = [ "1", "5", "10", "50", "75", "100" ];
for ( var i = 0; i < options.length; i++ )
{
    var selected = ( config[0].volume == i ) ? "selected" : "";
    %><option value="<%=options[ i ] %>" <%=selected %>><%=i %></option><%
}
%>
</select>

原文由 Don Rhummy 发布,翻译遵循 CC BY-SA 3.0 许可协议

当前答案有误,所以我想分享我找到的解决方案。

对于我的示例,我正在制作一个闹钟,并希望在选择下拉列表中输入“小时”值(0 到 12)。

 <select name="hour">
  <% var options = []; %>
  <% for(var i = 0; i <= 12; i++) { %>
    <option value='<%= i %>'><%= i %></option>
  <% } %>
</select>

请注意, name="hour" 用于在通过 POST 请求传递时标识所选值。您可以使用 req.body.hour 假设您正在运行类似的设置来获取此值。

  • 服务器端:Node.js / Express
  • 客户端:EJS/HTML

原文由 mster 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏