javascript - Flask - 在按钮 OnClick 事件上调用 python 函数

Question

我是 python 和 Flask 的新手。我有一个带有按钮的 Flask Web App。当我单击按钮时，我想执行 python 方法而不是 Javascript 方法。我该怎么做？

我看到过使用 python 的示例，它使用这样的表单标签将我重定向到新页面

<form action="/newPage" method="post">

但我不希望它将我重定向到新页面。我只是想让它执行 python 方法。我正在为 Raspberry Pi 机器人汽车制作这个。当我按下前进按钮时，我希望它运行向前转动车轮的方法。

按钮 HTML 代码 (index.html)

<button name="forwardBtn" onclick="move_forward()">Forward</button>

简单的 app.py 代码 - move_forward() 方法位于此处

#### App.py code

from flask import Flask, render_template, Response, request, redirect, url_for
app = Flask(__name__)

@app.route("/")
def index():
    return render_template('index.html');

def move_forward():
    #Moving forward code
    print("Moving Forward...")

我在 Stackoverflow 上看到过与我类似的问题，但他们似乎没有回答我的问题，或者我无法理解答案。如果有人能提供一种简单的方法来调用按钮单击事件的 Python 方法，将不胜感激。

我看过的其他问题:

-- Python Flask calling functions using buttons

-- Calling a python function with a button

-- Flask Button run Python without refreshing page?

Answer 1

您可以在 AJAX 的帮助下简单地做到这一点...这是一个调用 python 函数的示例，该函数在不重定向或刷新页面的情况下打印 hello。

在 app.py 中放入下面的代码段。

#rendering the HTML page which has the button
@app.route('/json')
def json():
    return render_template('json.html')

#background process happening without any refreshing
@app.route('/background_process_test')
def background_process_test():
    print ("Hello")
    return ("nothing")

您的 json.html 页面应如下所示。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>
        $(function() {
          $('a#test').on('click', function(e) {
            e.preventDefault()
            $.getJSON('/background_process_test',
                function(data) {
              //do nothing
            });
            return false;
          });
        });
</script>


//button
<div class='container'>
    <h3>Test</h3>
        <form>
            <a href=# id=test><button class='btn btn-default'>Test</button></a>
        </form>

</div>

在这里，当您在控制台中按下按钮 Test simple 时，您可以看到“Hello”正在显示而没有任何刷新。