Question

我正在尝试将一个临时工具放在一起供我个人使用，我根本没有后端开发经验。所以我的方法可能是非常规的。虽然可能有更好的方法来解决这个问题

从我的html文件中考虑以下代码段：

<tr><td>
    <button id="socks.shirt.pants"> dummy text here </button>
</td></tr>

我的目标，就像我可以说的那样，是单击BUTTON并使用Flask在python中返回ID属性中的字符串文本。以下是我正在使用的代码。

app = Flask(__name__)
@app.route('/', methods=['GET', 'POST'])
def index():
    #display html file
    return send_from_directory('','myfile.html')
    #this is the part that needs help
    textdata = request.htmlcontent.td.id

我尝试了几种不同的方法来提取html内容。包括但不限于：

request.html.tr.id,
request.get_data(),
request.data(),
request.form,

我现在理解request.form返回以表单提交的用户提供的信息，这对我不起作用，因为我想要检索的信息将被硬编码到html文件中，无论哪个标记都允许此过程工作。（目前为tr - ＆gt; td - ＆gt;按钮）。其他方法要么返回None，要么返回一些空字符串，我相信。

另外，我想知道是否有一些javascript代码除了Flask之外还需要使用？我希望提出这个问题不是一个不切实际的期望！任何建议都会有很大帮助！

Answer 1

您可以将ajax与jquery：

一起使用

在主filename.py中，包含这样的路由，从前端的json响应中访问参数。另外，提供一个呈现HTML模板的路径：

@app.route('/recieve_data')
def get_id():
  the_id = flask.request.args.get('button_id')
  return "<p>Got it!</p>"

@app.route('/', methods=['GET', 'POST'])
def home():
  return flask.render_template('filename.html')

在您的HTML（存储在filename.html）中，使用以下代码：

<html>
  <head>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  </head>
  <body>
    <tr><td>
     <button id="socks.shirt.pants" type='button'> dummy text here</button>
     <div id='response'></div>
    </td></tr>
  </body>
  <script>
   $(document).read(function() {
      $("button").click(function(event){
         var the_id = event.target.id;
         $.ajax({
            url: "/recieve_data",
            type: "get",
            data: {button_id: the_id},
           success: function(response) {
           $("#response").html(response);
         },
          error: function(xhr) {
        //Do Something to handle error
        }
       });
     });
   });
  </script>
</html>

Python Flask：返回HTML内容

1 个答案: