Question

我正在尝试创建一个接受按钮点击的Web应用程序。单击该按钮然后将特定设备和操作代码发送到python应用程序，然后使用Lirc调用irsend命令。这是基于此处的源代码/说明：

https://github.com/slimjim777/web-irsend

http://randomtutor.blogspot.com/2013/01/web-based-ir-remote-on-raspberry-pi.html

按钮的html很简单，位于“Xbox.html”

中

<button onclick="clickedOp('Xbox', 'OnOff');"> Power </button>

这将启动js功能：

<script>
function clickedOp(device_name, op) {
    $.ajax({url:'/' + device_name + '/clicked/' + op});
}

我知道该函数在click事件上触发，因为如果我在clickedOp函数中放置一个alert命令，则运行alert命令

python / flask应用程序如下所示：

from flask import Flask
from flask import render_template
from flask import request, redirect, url_for

BASE_URL = ''

app = Flask(__name__)


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

@app.route("/<device_name>")
def remote(device_name):
    if device_name == "Xbox":
        return render_template('Xbox.html')


@app.route("/<device_name>/clicked/<op>")
def clicked(device_id=None, op=None):
    return render_template('test.html')

if __name__ == "__main__":
    app.run('0.0.0.0', port=80, debug=True)

ajax请求的所有代码都有效。转到“/”加载menu.html模板并显示指向不同设备的链接，例如

<a href="Xbox"> Xbox </a>

将路由到

"/<device_name>"

在python程序中加载“Xbox.html”。然后按钮加载并单击它将触发“clickedOp（device_name，op）”函数。这就是它崩溃的地方。即使ajax请求路由到

"/<device_name>/clicked/<op>"

未加载“test.html”页面

即使Flask调试器说成功的GET请求（它返回200）到“/ Xbox / clicked / OnOff”（填写上面例子的变量），情况也是如此。

所以任何想法为什么没有从ajax请求加载test.html，当我在提供的源代码/教程中看起来他使用相同的ajax方法时？

Answer 1

在代码中，模板将呈现并返回到jquery Ajax对象，该对象将不执行任何操作 - 它不会在浏览器中呈现它。您是否使用过浏览器的开发人员工具来查看浏览器是否收到了响应 - 再次，如果Flask记录HTTP 200 OK，那么我会想象正在正确处理请求。您还应该能够在Flask方法中放置print语句并查看它们（我认为）。

Answer 2

你可以在AJAX的帮助下完成这个...这是一个调用python函数的例子，它打印你好而不重定向或刷新页面。

在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').bind('click', function() {
        $.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>

这里当您在控制台中按下“简单测试”按钮时，您可以看到＆＃34; Hello＆＃34;显示没有任何刷新。

单击Jquery按钮，使用Flask和Python发送AJAX请求

2 个答案: