使用 jQuery 加载 html 文件与 flask 一起交付时加载（）不起作用

Question

I've seen similar threads on StackOverflow but it doesn't seem to work.我在 StackOverflow 上看到过类似的线程，但它似乎不起作用。 I'm building a simple webapp where the user uploads a docx file and a python script does some processing and returns mp3 files for the user to download.我正在构建一个简单的 web 应用程序，用户在其中上传 docx 文件，并且 python 脚本进行一些处理并返回 mp3 文件供用户下载。

My script also generates a bunch of HTML files (contents of the doc) that I want to display on my webpage, eg loading text1.html into index.html.我的脚本还生成了一堆 HTML 文件（文档的内容），我想在我的网页上显示这些文件，例如将 text1.html 加载到 index.html 中。 But I'm running into two problems:但是我遇到了两个问题：

the text (text1.html) only appears when I open the page (index.html) HTML file directly and doesn't show when I load the web app with flask文本（text1.html）仅在我直接打开页面（index.html）HTML 文件时出现，当我使用 Z319C3206A7F10C17C3B9116D4A957646 加载 web 应用程序时不显示
text1.html only appears when it is in static/templates folder. text1.html 仅在静态/模板文件夹中出现。

index.html:索引.html：

<html>
<head>
  <script
          src="https://code.jquery.com/jquery-3.6.0.js"
          integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk="
          crossorigin="anonymous"></script>
  <script>
    $(document).ready(function(){
      $("#includedContent").load("text1.html");
    });
    </script>
</head>



<body>
<h3>Heading</h3>
<form method=post enctype=multipart/form-data id="form1">
  <input type=file name=uploadfield1>
<!--  <input id="ub" name=uploadbutton1 type=submit value=Upload >-->
  <button type="submit" name="uploadbutton1" value=Upload>Upload </button>
  <button type="button" name="removebutton" value="Remove">Remove </button>

</form>

<form method ="post" enctype=multipart/form-data >
  <button type="submit" name="tag1"  value="tag2">Process</button>

</form>


<p>
  text selected:
</p>

<div id="includedContent"></div>

</body>


</html>

and text1.html和文本1.html

<p> sample text from text1.html that is in projectfolder/templates folder </p>

I tried changing $("#includedContent").load("text1.html");我尝试更改$("#includedContent").load("text1.html"); to $("#includedContent").load("/Users/user/PycharmProjects/project/static/text1.html");到$("#includedContent").load("/Users/user/PycharmProjects/project/static/text1.html"); but that didn't work as well..但这也没有用..

so what is the correct way of loading in external HTML files?那么加载外部 HTML 文件的正确方法是什么？ Furthermore, since the files I'll be loading will be generated after index.html is loaded in, is there a better way to load these files?此外，由于我要加载的文件将在index.html加载后生成，有没有更好的方法来加载这些文件？ As I'm assuming things inside the static folder should be, well, static.正如我假设 static 文件夹中的内容应该是 static。

Answer 1

You can use ajax for it, it will not reload the page and can get the response.您可以使用 ajax ，它不会重新加载页面并且可以获得响应。

$.ajax({
type: "GET",// method
url: `${window.location.pathname}`, // route
data: {
  "key":"value" // json format in key value pair
},
contentType: "application/json;charset=UTF-8",
success: function (res) {
  console.log(res); // contents of text1.html
   }
});

You can use request.form.get("key") # key for the value and then return the text1.html您可以使用request.form.get("key") # key for the value ，然后返回 text1.html

return render_template("text1.html")

使用 jQuery 加载 html 文件与 flask 一起交付时加载（）不起作用

问题描述

1 个解决方案

解决方案1
-1 2021-06-10 06:36:25

使用 jQuery 加载 html 文件 与 flask 一起交付时加载（）不起作用

问题描述

1 个解决方案

解决方案1 -1 2021-06-10 06:36:25

使用 jQuery 加载 html 文件与 flask 一起交付时加载（）不起作用

解决方案1
-1 2021-06-10 06:36:25