Flask中获取下拉框选中值并复用问题：值为url_for()时无法获取

核心问题是下拉框选项的value存的是完整请求URL，而非你需要的platform标识（web/app）。这直接导致：

• 表单提交时，后端request.form.get('location')拿到的是整串URL，不是目标平台值
• 其他场景复用选中值时，还要从URL里解析，操作冗余且容易出错

1. 修改前端下拉框的选项值 #

把option的value直接设为平台标识，替换原来的url_for生成的URL：

<form id="select-platform" method="post">
   <label>选择平台</label>
    <select name="location" id="location" onchange="setIframeSource()">
      <option value="web">Web</option>
      <option value="app">App</option>
   </select>
</form>

2. 调整JS逻辑，动态生成iframe的src #

现在JS可以直接获取选中的platform值，拼接出静态文件的正确路径：

function setIframeSource() {
    var theSelect = document.getElementById('location');
    var theIframe = document.getElementById('plot');
    // 直接获取干净的platform标识
    var platform = theSelect.value;
    // 拼接静态文件URL
    theIframe.src = `/static/${platform}/graph.html`;
}

这样iframe依然能正确加载对应静态文件，同时下拉框的value就是可复用的平台标识。

3. 后端获取选中值的逻辑调整 #

表单提交后，后端现在能直接拿到正确的platform值：

@app.route('/maps', methods=['GET','POST'])
def maps():
    # 直接获取选中的平台值，比如'web'或'app'
    platform = request.form.get('location')
    print(platform)
    # 可以将值传给模板，供页面其他区域复用
    return render_template('maps.html', selected_platform=platform)

4. 页面其他场景复用选中值 #

• 前端复用：直接通过document.getElementById('location').value获取当前选中的平台值
• 后端渲染时复用：在模板里直接调用{{ selected_platform }}（需确保后端已将该变量传入模板）

如果想保留show_plot视图的转发逻辑，可修改JS拼接url_for生成的基础路径：

// 先在模板里定义视图的基础URL
var basePlotUrl = "{{ url_for('show_plot', platform='') }}";
theIframe.src = basePlotUrl + platform;

这样既保留了视图层的转发逻辑，又不影响平台值的获取与复用。

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