问题
I am developing a flask application, in which I have a dropdown, when I select an option, it should display below the dropdown "Your selected score : " and the selected score.
I am displaying a dropdown like below :
<select name="score">
{% for score in range(6) %}
<option value={{score}}> {{score}} </option>
{% endfor %}
</select>
I am displying thr selected value like :
Your selected score : {{ score }}
I tried and search a lot couldn't find anything. Any leads would be helpful.
回答1:
You need change event fired on select element.
Try,
<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>
回答2:
This should work:
<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>
来源：https://stackoverflow.com/questions/58419526/flask-how-to-display-a-selected-dropdown-value-in-same-html-page