博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
加载静态文件,父模板的继承和扩展
阅读量:5937 次
发布时间:2019-06-19

本文共 5083 字,大约阅读时间需要 16 分钟。

  1. 用url_for加载静态文件
    1. <script src="{
      { url_for('static',filename='js/login.js') }}"></script>
    2. flask 从static文件夹开始寻找
    3. 可用于加载css, js, image文件
  2. 继承和扩展
    1. 把一些公共的代码放在父模板中,避免每个模板写同样的内容。base.html
    2. 子模板继承父模板
      1.   {% extends 'base.html’ %}
    3. 父模板提前定义好子模板可以实现一些自己需求的位置及名称。block
      1. <title>{% block title %}{% endblock %}-MIS问答平台</title>
      2. {% block head %}{% endblock %}
      3. {% block main %}{% endblock %}
    4. 子模板中写代码实现自己的需求。block
      1.   {% block title %}登录{% endblock %}
  3. 首页、登录页、注册页都按上述步骤改写。

 

from flask import Flask,render_templateapp = Flask(__name__)@app.route('/')def shouye():    return render_template('shouye.html')@app.route('/denglu/')def denglu():    return render_template('denglu.html')@app.route('/zhuce/')def zhuce():    return render_template('zhuce.html')if __name__ == '__main__':    app.run()
    
{% block title %} 爱奇艺 {% endblock %}
{% block js %}{% endblock %}

{% block jiemian %}
推荐
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户登录{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户名
密码
普通用户
VIP用户
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户注册{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户昵称
输入密码
确认密码
普通用户
VIP用户
{% endblock %}
function myLogin() {
var one=document.getElementById("un"); var two=document.getElementById("pw"); var three=document.getElementById("error_box"); var four=document.getElementById("tpw"); if(two.value.length<6){ three.innerHTML="为了账号安全,请输入6个以上的密码!"; return } else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){
three.innerHTML="账号首个不能为数字!"; return } else if (two.value!=four.value){
three.innerHTML="输入密码不一致!请重新输入!"; return } else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){
three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
function myLogin() {            var one=document.getElementById("un");            var two=document.getElementById("pw");            var three=document.getElementById("error_box");            if(two.value.length<6){                three.innerHTML="为了账号安全,请输入6个以上的密码!";                return            }              else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){                three.innerHTML="账号首个不能为数字!";                return            }            else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){ three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
img{
width: 300px; height: 200px;}.img{
border:1px solid skyblue; width: 300px; height: 250px; float: left; margin: 5px;}.img img{
width:100%; height: 85%;}.desc{
text-align:center; padding: 5px;}.img:hover{
border: 1px solid blue;}p{
color:fuchsia;}.kk{
color:darkcyan;font-weight: bold;font-style: italic;font-size: 20px;}#abc{
color: darkblue;text-decoration: underline;font-size: 25px;}.aaa img{
height:50px; width:50px;}

 

转载于:https://www.cnblogs.com/1996liuda/p/7798276.html

你可能感兴趣的文章
zabbix接入百度告警详细攻略
查看>>
在Exchange 2010邮箱迁移时有用的命令行
查看>>
smarty学习
查看>>
11.python并发入门(part11 进程同步锁,以及进程池,以及callback的概念)
查看>>
GitHub简单仓库管理
查看>>
我的友情链接
查看>>
虚拟化技术对比
查看>>
angular的编辑器tinymce
查看>>
mybatis之三:与spring集成
查看>>
第二阶段团队进展报告(1)
查看>>
如何确定一个网站是用Wordpress开发的
查看>>
我的友情链接
查看>>
我的友情链接
查看>>
wdcp 安装
查看>>
C语言运算符优先级相关问题
查看>>
MP4视频播放器代码
查看>>
Nginx 匹配 iphone Android 微信
查看>>
MFC_Combo_Box(组合框)控件的用法
查看>>
ldap
查看>>
我的友情链接
查看>>