如何使用 Ajax 在 Flask 中显示返回的输入？

Question

我用一个输入制作了一个简单的 Flask 项目，这个输入必须用 AJAX 在主页面上返回。

我的 HTML 代码：

<!DOCTYPE HTML>
<html>
    <body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script type="text/javascript" src="{{ url_for('static', filename='script.js') }}"></script>    
   <div>        
        <div id="questionary">
            <form action='/process' method="POST" autocomplete="off">
                <div>
                    <input type="text"  name="question" id = "question" placeholder="Une question?">
                    <button type="submit"> Pose ta question :) </button>
        </div>
            </form> 
    </div>
        <div>
    <p id="response"></p>
    </div>        
    </body>    
</html>

我的阿贾克斯：

$(document).ready(function() {
    $('form').on('submit', function(event) {       
      $.ajax({
         data : {
            question : $('#question').val(),            
                },
            type : 'POST',
            url : '/process'
           })           
       .done(function(data) {                 
        $('#response').text(data.output).show();        
     });
     event.preventDefault();
     });     
});

我的烧瓶：

from flask import Flask, render_template, request, jsonify 
import json

app = Flask(__name__)

@app.route('/')
def homepage():
    return render_template('main.html')

@app.route('/process', methods=['POST'])
def process():          
    user_question = request.form['question']
    print(user_question)   
    return jsonify({'response' : user_question})

if __name__ == '__main__':
    app.run

Ajax 在 /static 中，html 在 /templates 中。 所需的输出是在表单下显示的问题。

Answer 1

如果您更改，则工作：

$('#response').text(data.output).show();

经过：

$('#response').text(data['response']).show();

data 是一个 json 对象，这是访问其值的正确方法。

如何使用 Ajax 在 Flask 中显示返回的输入？

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-03-17 13:50:46

如何使用 Ajax 在 Flask 中显示返回的输入？

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-03-17 13:50:46

解决方案1
0 已采纳 2020-03-17 13:50:46