Javascript 模板未通过烧瓶正确渲染
当我运行我的代码时,它正在我的模板中读取,但是来自所有html的标记都显示在我的div中,看起来很糟糕,我将期待下一步添加和图像到它,它不会工作,它将只显示我为它编写的代码 这是我的网页webapp.pyJavascript 模板未通过烧瓶正确渲染,javascript,python,html,flask,get,Javascript,Python,Html,Flask,Get,当我运行我的代码时,它正在我的模板中读取,但是来自所有html的标记都显示在我的div中,看起来很糟糕,我将期待下一步添加和图像到它,它不会工作,它将只显示我为它编写的代码 这是我的网页webapp.py from flask import Flask, render_template, request app = Flask(__name__) @app.route("/") def root(): return app.send_static_file('index.html
from flask import Flask, render_template, request
app = Flask(__name__)
@app.route("/")
def root():
return app.send_static_file('index.html')
@app.route("/london")
def name():
return "London is the capital and most populous city of England and the United Kingdom."
@app.route("/paris")
def paris():
return "Paris is the captial of France and the most populated in France "
@app.route("/japan")
def japan():
return render_template('japan.html')
if __name__ == "__main__":
app.run()
这是我的templates文件夹中的my japan.html,我用japan按钮调用它
<!doctype html>
<title>Japan</title>
<h1>Japan </h1>
<p>Japan is an island nation in the Pacific Ocean with dense cities, imperial palaces, mountainous national parks and thousands of shrines and temples. </p>
<p>Shinkansen bullet trains connect the main islands of Kyushu (with Okinawa's subtropical beaches), Honshu (home to Tokyo and Hiroshima’s atomic-bomb memorial) and Hokkaido (famous for skiing).</p>
<p> Tokyo, the capital, is known for skyscrapers, shopping and pop culture.</p>
日本
日本
日本是太平洋上的一个岛国,拥有密集的城市、皇宫、山地国家公园和数千座神社和寺庙
新干线子弹头列车连接九州(冲绳亚热带海滩)、本州(东京和广岛原子弹纪念馆所在地)和北海道(以滑雪闻名)
首都东京以摩天大楼、购物和流行文化而闻名
最后是静态文件夹中的my index.html:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#londonbutton").click(function(){
$.get("/london", function(data, status){
$("#city").text(data);
});
});
});
$(document).ready(function(){
$("#parisbutton").click(function(){
$.get("/paris", function(data, status){
$("#city").text(data);
});
});
});
$(document).ready(function(){
$("#japanbutton").click(function(){
$.get("/japan", function(data, status){
$("#city").text(data);
});
});
});
</script>
</head>
<body>
<input type="submit" name="London" id="londonbutton" value="Update London">
<input type="submit" name="Paris" id="parisbutton" value="Update Paris">
<input type="submit" name="Japan" id="japanbutton" value="Update Japan">
<h2> Capital City</h2>
<div id = "city">
<h2>city name</h2>
<p>Some text about a city</p>
</div>
</body>
</html>
$(文档).ready(函数(){
$(“#伦敦按钮”)。单击(函数(){
$.get(“/london”,函数(数据、状态){
$(“#城市”)。文本(数据);
});
});
});
$(文档).ready(函数(){
$(“#巴黎按钮”)。单击(函数(){
$.get(“/paris”,函数(数据、状态){
$(“#城市”)。文本(数据);
});
});
});
$(文档).ready(函数(){
$(“#日本按钮”)。单击(函数(){
$.get(“/japan”,函数(数据、状态){
$(“#城市”)。文本(数据);
});
});
});
首都
城市名称
一些关于城市的文字
问题在这里(index.html中的第23行):
jQuery将转义所有HTML(因此它只显示为文本),您需要在此处使用
$("#city").html(data);
问题在这里(index.html中的第23行):
jQuery将转义所有HTML(因此它只显示为文本),您需要在此处使用
$("#city").html(data);