Day17 表单验证、滚动菜单、WEB框架
一、表单验证的两种实现方式
1、DOM绑定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证(DOM绑定)</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: red;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body>
<div>
<form>
<div class="item">
<input class="c1" type="text" name="username" label="用户名" />
<!--<span>用户名不能为空</span>-->
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码" />
<!--<span>密码不能为空</span>-->
</div>
<input type="submit" value="提交" onclick="return CheckValid();" />
<!--<input type="submit" value="提交" />-->
</form>
</div>
<script src="jquery-1.12.4.js"></script>
<script>
function CheckValid() {
//找到form标签下的所有需要验证的标签
//$('form .c1')
//$('form input[type="text"],form input[type="password"]')
//循环所有需要验证的标签，获取内容
//移除错误提示
$('form .item span').remove();
var flag = true;
$('form .c1').each(function () {
//每一个元素执行一次匿名函数
//this：当前元素
//console.log(this,$(this));
var val = $(this).val();
if(val.length <=0){
var label = $(this).attr('label');
var tag = document.createElement('span');
tag.innerText = label + "不能为空";
$(this).after(tag);
flag = false;
}
});
return flag;
}
</script>
</body>
</html>
2、jQuery绑定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证(jQuery绑定)</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: red;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body>
<div>
<form>
<div class="item">
<input class="c1" type="text" name="username" label="用户名" />
<!--<span>用户名不能为空</span>-->
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码" />
<!--<span>密码不能为空</span>-->
</div>
<input type="submit" value="提交" />
</form>
</div>
<script src="jquery-1.12.4.js"></script>
<script>
$(function(){
//当页面加载完成后自动执行
BindCheckValid();
}); function BindCheckValid() {
$('form :submit').click(function() {
//只要点击submit按钮，执行此处内容，找到form标签下的所有需要验证的标签
$('form .item span').remove();
var flag = true;
$('form .c1').each(function () {
//每一个元素执行一次匿名函数
//this：当前元素
//console.log(this,$(this));
var val = $(this).val();
if (val.length <= 0) {
var label = $(this).attr('label');
var tag = document.createElement('span');
tag.innerText = label + "不能为空";
$(this).after(tag);
flag = false;
return false;
}
});
return flag;
});
}
</script>
</body>
</html>
二、jQuery补充
1、jQuery中each返回值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery中each返回值</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: indianred;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body> <div>
<form>
<div class="item">
<input class="c1" type="text" name="username" label="用户名"/>
<!--<span>用户名不能为空</span>-->
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码"/>
<!--<span>密码不能为空</span>-->
</div>
<!--<input type="submit" value="提交" onclick="return CheckValid();" />-->
<input type="submit" value="提交" />
</form>
</div> <script src="jquery-1.12.4.js"></script>
<script> function BindCheckValid(){ $.each([11,22,33,44],function(k,v){
if(v == 22){
//return ; // continue
return false; //break
}
console.log(v);
})
} BindCheckValid(); </script>
</body>
</html>
2、jQuery扩展
扩展1：
extend1.js
/**
* Created by WangHuafeng on 2016/10/15.
*/
(function (jq) {
jq.extend({
'radar' : function (arg) {
console.log(arg);
}
});
function f1() { }
})(jQuery);
//1、自执行；2、闭包
/*
a = function (jq) {
//调用时没有选择器
jq.extend({
'radar' : function (arg) {
console.log(arg);
}
});
function f1() { }
};
a(jQuery);
*/
extend1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery扩展1</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: indianred;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body> <div>
<form>
<div class="item">
<input class="c1" type="text" name="username" label="用户名"/>
<!--<span>用户名不能为空</span>-->
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码"/>
<!--<span>密码不能为空</span>-->
</div>
<!--<input type="submit" value="提交" onclick="return CheckValid();" />-->
<input type="submit" value="提交" />
</form>
</div> <script src="jquery-1.12.4.js"></script>
<script src="extend1.js"></script>
<script>
$.radar('welcome radar 扩展1');
</script>
</body>
</html>
扩展2：
extend2.js
/**
* Created by WangHuafeng on 2016/10/15.
*/ (function (jq) {
//调用的时候可以有选择器
$.fn.extend({
'radar1' : function (arg) {
//this：代指前面的选择器
console.log(arg);
}
});
function f2() { }
})(jQuery); /*
b = function () {
//调用的时候可以有选择器
$.fn.extend({
'radar1' : function (arg) {
//this：代指前面的选择器
console.log(arg);
}
});
function f2() { }
};
b(jQuery);
*/
extend2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery扩展2</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: indianred;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body> <div>
<form>
<div class="item">
<input class="c1" type="text" name="username" label="用户名"/>
<!--<span>用户名不能为空</span>-->
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码"/>
<!--<span>密码不能为空</span>-->
</div>
<!--<input type="submit" value="提交" onclick="return CheckValid();" />-->
<input type="submit" value="提交" />
</form>
</div> <script src="jquery-1.12.4.js"></script>
<script src="extend2.js"></script>
<script>
$('form').radar1('welcome radar1 扩展2');
</script>
</body>
</html>
3、表单验证jQuery扩展
commons.js
/**
* Created by WangHuafeng on 2016/10/15.
*/
(function (jq) {
jq.extend({
valid:function (form) {
//#form1 $('#form1')
jq(form).find(':submit').click(function () {
jq(form).find('.item span').remove();
var flag = true;
jq(form).find(':text,:password').each(function () {
var val = $(this).val();
if (val.length <= 0) {
var label = $(this).attr('label');
var tag = document.createElement('span');
tag.innerText = label + "不能为空";
$(this).after(tag);
flag = false;
return false;//相当于break
}
});
return flag;
});
}
});
})(jQuery);
j1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证(jQuery扩展)</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: red;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body>
<div>
<form id="form1">
<div class="item">
<input class="c1" type="text" name="username" label="用户名" />
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码" />
</div>
<input type="submit" value="提交" />
</form>
<form id="form2">
<div class="item">
<input class="c1" type="text" name="username" label="用户名" />
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码" />
</div>
<input type="submit" value="提交" />
</form>
</div>
<script src="jquery-1.12.4.js"></script>
<script src="commons.js"></script>
<script>
$(function () {
$.valid('#form1');
//valid:$('#form1')
});
</script>
</body>
</html>
4、表单验证自定义属性
commons2.js
/**
* Created by WangHuafeng on 2016/10/15.
*/
(function (jq) {
function ErrorMessage(inp,message) {
var tag = document.createElement('span');
tag.innerText = message;
inp.after(tag);
}
jq.extend({
valid:function (form) {
jq(form).find(':submit').click(function () {
jq(form).find('.item span').remove();
var flag = true;
jq(form).find(':text,:password').each(function () { var require = $(this).attr('require');
if(require){
var val = $(this).val();
if (val.length <= 0) {
var label = $(this).attr('label');
ErrorMessage($(this),label + "不能为空");
flag = false;
return false;//相当于break
}
var minLen = $(this).attr('min-len');
if(minLen){
var minLenInt = parseInt(minLen);
if(val.length<minLenInt){
var label = $(this).attr('label');
ErrorMessage($(this),label + "最小长度为"+ minLen);
flag = false;
return false;//相当于break
}
//json.stringfy()
//JSON.parse() 字典转换为字符串
}
var phone = $(this).attr('phone');
if(phone){
//用户输入内容是否为手机号码格式
var phoneReg = /^1[3|5|8]\d{9}$/;
if(!phoneReg.test(val)){
var label = $(this).attr('label');
ErrorMessage($(this),label + "格式错误");
flag = false;
return false;//相当于break
}
}
//自定义标签格式
//验证
}
});
return flag;
});
}
});
})(jQuery);
j2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证(自定义属性)</title>
<style>
.item{
width: 250px;
height: 60px;
position: relative;
}
.item input{
width: 200px;
}
.item span{
position: absolute;
top: 20px;
left: 0px;
font-size: 8px;
background-color: red;
color: white;
display: inline-block;
width: 200px;
}
</style>
</head>
<body>
<div>
<form id="form1">
<div class="item">
<input class="c1" type="text" name="username" label="用户名" require="true" min-len="6" />
</div>
<div class="item">
<input class="c1" type="password" name="pwd" label="密码" />
</div>
<div class="item">
<input class="c1" type="text" name="tel" label="手机号码" require="true" phone="true" />
</div>
<input type="submit" value="提交" />
</form>
</div>
<script src="jquery-1.12.4.js"></script>
<script src="commons2.js"></script>
<script>
$(function () {
$.valid('#form1');
//valid:$('#form1')
});
</script>
</body>
</html>
三、滚动菜单
scroll_menu.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style> body{
margin: 0px;
}
img {
border: 0;
}
ul{
padding: 0;
margin: 0;
list-style: none;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
} .wrap{
width: 980px;
margin: 0 auto;
} .pg-header{
background-color: #303a40;
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,.2);
-moz-box-shadow: 0 2px 5px rgba(0,0,0,.2);
box-shadow: 0 2px 5px rgba(0,0,0,.2);
}
.pg-header .logo{
float: left;
padding:5px 10px 5px 0px;
}
.pg-header .logo img{
vertical-align: middle;
width: 110px;
height: 40px; }
.pg-header .nav{
line-height: 50px;
}
.pg-header .nav ul li{
float: left;
}
.pg-header .nav ul li a{
display: block;
color: #ccc;
padding: 0 20px;
text-decoration: none;
font-size: 14px;
}
.pg-header .nav ul li a:hover{
color: #fff;
background-color: #425a66;
}
.pg-body{ }
.pg-body .catalog{
position: absolute;
top:60px;
width: 200px;
background-color: #fafafa;
bottom: 0px;
}
.pg-body .catalog.fixed{
position: fixed;
top:10px;
} .pg-body .catalog .catalog-item.active{
color: #fff;
background-color: #425a66;
} .pg-body .content{
position: absolute;
top:60px;
width: 700px;
margin-left: 210px;
background-color: #fafafa;
overflow: auto;
}
.pg-body .content .section{
height: 500px;
}
</style>
</head>
<body> <div class="pg-header">
<div class="wrap clearfix">
<div class="logo">
<a href="#">
<img src="">
</a>
</div>
<div class="nav">
<ul>
<li>
<a href="#">首页</a>
</li>
<li>
<a href="#">功能一</a>
</li>
<li>
<a href="#">功能二</a>
</li>
</ul>
</div> </div>
</div> <div class="pg-body">
<div class="wrap">
<div class="catalog">
<div class="catalog-item" auto-to="function1"><a>第1张</a></div>
<div class="catalog-item" auto-to="function2"><a>第2张</a></div>
<div class="catalog-item" auto-to="function3"><a>第3张</a></div>
</div> <div class="content">
<div menu="function1" class="section" style='background-color:green;'>
<h1>第一章</h1>
</div>
<div menu="function2" class="section" style='background-color:yellow;'>
<h1>第二章</h1>
</div>
<div menu="function3" class="section" style='background-color:red;'>
<h1>第三章</h1>
</div>
</div>
</div> </div> <script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript"> $(function(){
// 自动执行
Init();
}); function Init(){ $(window).scroll(function() {
// 监听窗口滚动事件 // 获取滚动条高度
var scrollTop = $(window).scrollTop(); // 当滚动到50像素时，左侧带菜单固定
if(scrollTop > 50){
$('.catalog').addClass('fixed');
}else{
$('.catalog').children().removeClass('active');
$('.catalog').removeClass('fixed');
} // 循环所有的内容
$('.content').children().each(function(){
// 当前标签距离顶部高度
var offSet = $(this).offset(); // 高度，左边有多远
// offSet.top
// offSet.left // 自身高度
var height = $(this).height(); //offSet<滚动高度<offSet+height // 当前内容位于用户阅览区
if(scrollTop>offSet.top && scrollTop< offSet.top + height){
// $(this) 当前内容标签
/*
var target = $(this).attr('menu');
$('.catalog').find('div[auto-to="'+target+'"]').addClass('active').siblings().removeClass('active');
return false;
*/ var docHeight = $(document).height();
var winHeight = $(window).height();
// 如果，滚轮到达底部，则显示最后一个菜单
if(docHeight == winHeight+scrollTop)
{
$('.catalog').find('div:last-child').addClass('active').siblings().removeClass('active');
}else{
var target = $(this).attr('menu');
$('.catalog').find('div[auto-to="'+target+'"]').addClass('active').siblings().removeClass('active');
}
return false; }
}); }); } </script>
</body>
</html>
总结：
jQuery示例：
表单验证，jQuery扩展
1、回顾基础内容 2、dom事件绑定 3、jquery事件绑定 4、$.each return false 表示break; 5、jquery扩展方法：
两种方式： 6、自定义jQuery扩展的正确方法：
a. 自执行
b. 闭包 7、jquery扩展实现基本验证 a. 支持是否允许为空 b. 长度 c. 正则表达式
定义正则表达式
reg = /正则表达式/ *****
g
i
m ==> 特殊 利用正则匹配
reg.test(字符串) *****
reg.exec(字符串)
全局
非全局
字符串三个方法：
search
match
replace
-- 特殊符号 滚动菜单
页面布局（absolute）
监听滚动事件：
如果滚动>60,菜单固定
如果滚动<,菜单固定取消 前端插件：
fontawsome easyui
jqueryui
bootstrap
-- 引入css -- 引入jQuery（2.x，1.12）
-- 引入js -- bootstrap模版 bxslider
jquery.lazyload
四、WEB框架
#!/usr/bin/env python
#coding:utf-8 import socket def handle_request(client):
buf = client.recv(1024)
client.send("HTTP/1.1 200 OK\r\n\r\n")
client.send("Hello, Seven") def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost',8000))
sock.listen(5) while True:
connection, address = sock.accept()
handle_request(connection)
connection.close() if __name__ == '__main__':
main()
WSGI（Web Server Gateway Interface）是一种规范，它定义了使用python编写的web app与web server之间接口格式，实现web app与web server间的解耦。
python标准库提供的独立WSGI服务器称为wsgiref。
通过python标准库提供的wsgiref模块开发一个自己的Web框架
#!/usr/bin/env python
#coding:utf-8
from wsgiref.simple_server import make_server def index():
return 'index' def login():
return 'login' def routers(): urlpatterns = (
('/index/',index),
('/login/',login),
) return urlpatterns def RunServer(environ, start_response):
start_response('200 OK', [('Content-Type', 'text/html')])
url = environ['PATH_INFO']
urlpatterns = routers()
func = None
for item in urlpatterns:
if item[0] == url:
func = item[1]
break
if func:
return func()
else:
return '404 not found' if __name__ == '__main__':
httpd = make_server('', 8000, RunServer)
print "Serving HTTP on port 8000..."
httpd.serve_forever()
框架demo
#!/usr/bin/env python
#coding:utf-8
# Author: wanghuafeng from wsgiref.simple_server import make_server def i1():
return 'i1' def i2():
return 'i2' def RunServer(environ, start_response):
start_response('200 OK', [('Content-Type', 'text/html')])
#获取用户url，根据用户url响应不同内容
#environ，封装了用户所有请求内容
#路由系统
if environ.url == 'index':
return i1()
elif environ.url == 'login':
return i2()
else:
return "" return '<h1>Hello,Web!</h1>'
if __name__ == '__main__':
httpd = make_server('', 8000, RunServer) #IP、端口、函数名
print("Serving HTTP on port 8000...")
httpd.serve_forever()
处理用户请求 放置HTML模板 操作数据库
Controller Views Models
MVC框架 Views Template Models
MTV框架
五、Django
1、安装Django
python -m pip install django
python3 -m pip install django
添加环境变量
C:\SourceForge\Python35\Lib\site-packages\django\bin
2、创建Project
django-admin startproject D:\Django\mysite
mysite目录
mysite
- settings.py #配置文件
- urls.py #路由系统
- wsgi.py #WSGI
- manage.py #django程序启动文件
3、创建APP(一个Project下可以创建多个APP)
cd mysite
python3 manage.py startapp cmdb
4、配置路由映射和服务请求
from django.conf.urls import url
from django.contrib import admin
from cmdb import views urlpatterns = [
#url(r'^admin/', admin.site.urls),
url(r'^index/', views.index),
]
urls.py
from django.shortcuts import render
from django.shortcuts import HttpResponse
# Create your views here.
def index(request):
return HttpResponse('')
views.py
5、启动Django程序
python3 manage.py runserver 127.0.0.1:8000
访问：http://127.0.0.1:8000/index/
显示：123
6、返回html
templates中创建index.html
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 style="color: red;font-size: 50px;">Django</h1>
</body>
</html>
index.html
from django.shortcuts import render
from django.shortcuts import HttpResponse
# Create your views here.
def index(request):
#return HttpResponse('123')
return render(request,'index.html')
views.py
7、静态文件配置
创建statics目录将jquery-1.8.2.min.js文件放置到该目录
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 style="color: red;font-size: 50px;">Django</h1>
<script src="/fff/jquery-1.8.2.min.js"></script>
</body>
</html>
index.html
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/ #静态文件引入时的前缀
STATIC_URL = '/fff/'
#静态文件目录
STATICFILES_DIRS = (
os.path.join(BASE_DIR,'statics'),
)
settings.py
8、模板引擎
from django.shortcuts import render
from django.shortcuts import HttpResponse
# Create your views here. #先设置默认值
USER_INPUT = [
{'user':'u1','email':'e1'},
{'user':'u2','email':'e2'},
]
def index(request): #判断用户是否是POST请求
if(request.method == 'POST'):
user = request.POST.get('user',None)
email = request.POST.get('email',None)
#print(user, email)
temp = {'user':user,'email':email}
#将用户输入的数据加入全局列表中
USER_INPUT.append(temp)
#request.POST.get('pwd',None)
#return HttpResponse('123')
#模板引擎
#获取index.html模板 + {'data' : USER_INPUT} ==》渲染（把for循环转换为python的for循环）
#最终得到一个替换完成的字符串
return render(request,'index.html',{'data' : USER_INPUT})
views.py
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>用户输入：</h1>
<form action="/index/" method="POST">
<input type="text" name="user">
<input type="text" name="email">
<input type="submit" value="提交">
</form>
<h1>数据展示：</h1>
<table border="1">
{% for item in data %}
<tr>
<td>{{ item.user }}</td>
<td>{{ item.email }}</td>
</tr>
{% endfor %}
</table>
<script src="/fff/jquery-1.8.2.min.js"></script>
</body>
</html>
index.html
9、数据库操作
from django.db import models # Create your models here.
class UserInfo(models.Model):
#字符串类型必须指定长度
user = models.CharField(max_length=32)
email = models.CharField(max_length=32)
models.py
执行命令创建数据库表结构：
python3 manage.py makemigrations
python3 manage.py migrate
注册APP
# Application definition INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
#注册APP
'cmdb',
]
settings.py
from django.shortcuts import render
from django.shortcuts import HttpResponse
from cmdb import models
# Create your views here. def index(request): #判断用户是否是POST请求
if(request.method == 'POST'):
u = request.POST.get('user',None)
e = request.POST.get('email',None)
#添加数据到数据库
models.UserInfo.objects.create(user=u, email=e) #获取数据库的数据
data_list = models.UserInfo.objects.all()
#[UserInfo对象，UserInfo对象，UserInfo对象，UserInfo对象，...]
# for item in data_list:
# print(item.user,item.email)
return render(request,'index.html',{'data':data_list})
views.py
重新启动服务，登录访问：http://127.0.0.1:8000/index
10、总结
安装：
python -m pip install django
python3 -m pip install django
添加环境变量
C:\SourceForge\Python35\Lib\site-packages\django\bin 1、创建mysite项目
django-admin startproject D:\Django\mysite
mysite
mysite
- settings.py #配置文件
- urls.py #路由系统
- wsgi.py #WSGI
manage.py #django程序启动文件 2、创建APP
cd mysite
python3 manage.py startapp cmdb 3、编写代码
urls.py
view.py 函数 4、启动Django程序
python3 manage.py runserver 127.0.0.1:8000 5、使用模板
settings配置
render(request,'路径') 6、静态文件的配置(自定义目录)
STATIC_URL = 'fff'
STATICFILES_DIRS = (
os.path.join(BASE_DIR,'statics'),
)
statics目录放置静态文件
<script src="/fff/jquery-1.8.2.min.js"></script> CSRF:跨栈请求伪造 7、ORM
models.py
from django.db import models # Create your models here.
class UserInfo(models.Model):
#字符串类型必须指定长度
user = models.CharField(max_length=32)
email = models.CharField(max_length=32) 注册APP
# Application definition INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
#注册APP
'cmdb',
] 执行命令：
python3 manage.py makemigrations
python3 manage.py migrate
====>数据库已创建 8、操作数据库
创建:
models.类.objects.create(user=u, email=e)
models.类.objects.create(user=u, email=e)
models.类.objects.create(user=u, email=e)
models.类.objects.create(user=u, email=e)
操作：
models.类.objects.all()
Day17 表单验证、滚动菜单、WEB框架的更多相关文章
- 再说表单验证，在Web Api中使用ModelState进行接口参数验证
写在前面 上篇文章中说到了表单验证的问题,然后尝试了一下用扩展方法实现链式编程,评论区大家讨论的非常激烈也推荐了一些很强大的验证插件.其中一位园友提到了说可以使用MVC的ModelState,因为之前 ...
- jQuery补充之jQuery扩展/form表单提交/滚动菜单
jQuery扩展 为了避免重复造轮子,能高效使用别人的代码,所以有了扩展. jQuery扩展有两种方式: 自执行函数方式 定义函数,并执行函数. 自执行函数: (function(jq){ jq.ex ...
- python_way day17 jQuery表单验证，事件绑定，插件，文本框架，正则表达式
python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...
- web框架-（六）Django补充---form表单验证
一.form表单验证 1. 常规html页面的form表单验证 常规页面中,如果想实现对表单中用户输入信息的数据验证,需要配合Ajax来实现. 使用前我们先来熟悉下函数参数:request,其中包含的 ...
- ValidationSugar表单验证框架-支持ASP.NET MVC ASP.NET WebFroM
ValidationSugar表单验证框架的优点: 1.支持javascript端和后端的双重验证 (前端目前依赖于jquery.validate.js,也可以自已扩展) 2.代码简洁 3.调用方便 ...
- Web开发-表单验证
表单验证是Web开发中必不可少的一个环节,用来限制用户输入数据的规范和一致性.那么如何能够简化这一任务,让开发人员通过简单的属性设置就能达到目的呢? FineUI在这一点上也是下足了功夫,比Asp.N ...
- MVC身份验证.MVC过滤器.MVC6关键字Task,Async.前端模拟表单验证,提交.自定义匿名集合.Edge导出到Excel.BootstrapTree树状菜单的全选和反选.bootstrap可搜索可多选可全选下拉框
1.MVC身份验证. 有两种方式.一个是传统的所有控制器继承自定义Control,然后再里面用MVC的过滤器拦截.所以每次网站的后台被访问时.就会先走入拦截器.进行前端和后端的验证 一个是利用(MVC ...
- [JavaWeb基础] 015.Struts2 表单验证框架
在web开发的过程中,我们经常要用到一些填写表单的操作,我们一般都要在提交表单信息的时候对表单的内容进行验证,struts2给我们提供了简单的实现接口,让我们可以很容易的对表单进行验证.下面讲解下最传 ...
- ThinkPHP框架下的表单验证
之前的表单验证都是用js写的,这里也可以使用tp框架的验证.但是两者比较而言还是js验证比较好,因为tp框架验证会运行后台代码,这样运行速度和效率就会下降. 自动验证是ThinkPHP模型层提供的一种 ...
随机推荐
- sublime 汉化及注册
首先安装 package control https://packagecontrol.io/installation 网站上面有详细说明 安装以后快捷键 ctrl +shift+p 输入ip ...
- 简单总结一下NotificationCenter、KVC、KVO、Delegate
将最近总结的最常用的几种设计模式优势与区别自己小结一下,分享给大家. kvo只能用来对属性作出反应,而不会用来对方法或者动作作出反应,是实现一个对象与另外一个对象保持同步的一种方法,能够提供观察的属性 ...
- JDBC——事物管理
案例:银行转账问题,数据库如下 相关API setAutoCommit(boolean autoCommit) 将此连接的自动提交模式设置为给定状态.设置事务是否自动提交如果设置为false,表示手 ...
- mysql日志设置
mysql有一个功能就是可以log下来运行的比较慢的sql语句,默认是没有这个log的,为了开启这个功能,要修改my.cnf或者在mysql启动的时候加入一些参数.如果在my.cnf里面修改,需增加如 ...
- java数据库连接池dbcp的使用
近年来,随着Internet/Intranet建网技术的飞速发展和在世界范围内的迅速普及,计算机 应用程序已从传统的桌面应用转到Web应用.基于B/S(Browser/Server)架构的3层开发模式 ...
- [Webpack 2] Polyfill Promises for Webpack 2
If you're going to use code splitting with Webpack 2, you'll need to make sure the browser has suppo ...
- PureMVC(JS版）源码解析（五）：SimpleCommand类
之前我们对PureMVC中涉及到观察者模式的三个基本类(Notification/Observer/Notifier)进行了分析,接下来将对PureMVC源码中的其他类进行分析,首先我们讲 ...
- Linux学习笔记总结--云服务器挂载磁盘
1.通过 "fdisk -l" 命令查看 若执行fdisk -l命令,发现没有 /dev/xvdb 表明云服务无数据盘 2. 对数据盘进行分区 执行"fdisk /de ...
- [转] Tomcat 配置 SSL
PS: keystore有自己的访问密码,这个保护层次要低一些,然后keystore里面存有自己的私钥,所以用户要破解的话,既要有keystore,又要有keystore的密码,p12是客户端keys ...
- SDWebImage 原理及使用
这个类库提供一个UIImageView类别以支持加载来自网络的远程图片.具有缓存管理.异步下载.同一个URL下载次数控制和优化等特征. SDWebImage 加载图片的流程 入口 setImageWi ...