Question

我正在开发一个flask应用程序，其中有一个下拉列表，当我选择一个选项时，它应显示在下拉列表“ Your selected score：”和选定分数下方。

我正在显示如下所示的下拉列表：

<select name="score">
    {% for score in range(6) %}
    <option value={{score}}> {{score}} </option>
    {% endfor %}
</select>

我正在显示thr所选值：

Your selected score : {{ score }}

我尝试了很多，却找不到任何东西。任何线索都将有所帮助。

Answer 1

这应该有效：

<html>
<head>
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
  <script>
    $(document).ready(function(){
      $('select').on('change', function(){
        $('#result').html('Your score is: ' + $(this).find('option:selected').val());
      });
    });
  </script>
</head>
<body>
  <select name="score">
    {% for score in range(6) %}
    <option value="{{score}}">{{score}}</option>
    {% endfor %}
  </select>
  <div id="result"></div>
</body>
</html>

Answer 2

您需要在选择元素上触发change event。

尝试

<select name="score" onchange="updateSelected(event)">
    {% for score in range(6) %}
    <option value={{score}}> {{score}} </option>
    {% endfor %}
</select>
<div id="res"></>

<script>
    function updateSelected(event) {
        document.getElementById('res').innerHTML = 'Your selected score : ' + event.target.value;
    }
</script>

flask-如何在同一HTML页面中显示选定的下拉值？

2 个答案: