Как получить доступ к определенному html в python Flask?
Я пытаюсь создать лист персонажей RPG, используя флягу. В этом проекте у меня есть две кнопки ( level+ и level- ), которые добавляют или уменьшают уровень персонажа при нажатии.
Итак, у меня есть html-файл:
<div class = "level">
<button type = "button" name = "level-">-</button>
<p>{{ level }}</p>
<button type = "button" name = "level+">+</button>
</div>
и мой файл фляги:
from flask import Flask, render_template, request
app = Flask(__name__)
@app.route('/', methods=['POST', 'GET'])
def index():
level = 0
return render_template('index.html', level=level)
if __name__ == '__main__':
app.run(debug=True)
Как мне получить доступ к кнопкам, чтобы я мог увеличивать или уменьшать переменную уровня в файле python?
Ответы 2
Если вы хотите, чтобы у него были действия на стороне сервера, вам, вероятно, потребуется создать его HTML-форму, чтобы браузер отправлял POST-запрос к API вашего веб-сайта. Если вы хотите, чтобы у него были действия на стороне клиента, вам нужно будет создать сценарий Javascript, чтобы браузер выполнял код, когда пользователь нажимает кнопку.
Я предлагаю сделать это с помощью javascript, так как это менее ресурсоемко, чем отправка запроса на серверную часть и передача нового уровня в шаблон.
<div class = "level">
<button type = "button" name = "level-" onclick = "changeLevel(-1)">-</button>
<p id = "level_number">{{ level }}</p>
<button type = "button" name = "level+" onclick = "changeLevel(1)">+</button>
</div>
<script>
function changeLevel(change) {
var x = document.getElementById("level_number");
if (parseInt(x.innerHTML) + change >=0){
x.innerHTML = parseInt(x.innerHTML) + change;
}
}
</script>
Если вы необходимость уровня в своем бэкэнде, вы можете использовать AJAX или использовать скрытый ввод в форме и прочитать значение в бэкэнде, используя request.form["level_number"]
<form class = "level">
<button type = "submit" name = "level-" onclick = "changeLevel(-1)">-</button>
<p id = "level_number">2</p>
<input type = "hidden" name = "level_number" id = "hidden_level_number" value = "{{ level }}"/>
<button type = "submit" name = "level+" onclick = "changeLevel(1)">+</button>
</form>
<script>
function changeLevel(change) {
var x = document.getElementById("level_number");
var y = document.getElementById("hidden_level_number");
if (parseInt(x.innerHTML) + change >=0){
x.innerHTML = parseInt(x.innerHTML) + change;
y.value=x.innerHTML;
}
}
</script>
Спасибо! Сейчас это работает. На самом деле я пытался обновить уровень из бэкэнда, но обновить его из внешнего интерфейса, а затем обновить его в бэкэнде проще.
Отвечает ли это на ваш вопрос? Кнопка Flask передает переменную обратно в python