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模型层提供的一种 ...
随机推荐
- php 写一个水仙花数的函数
判断一个数是不是水仙花数 <?php function is_shuixianhua($i) { $length=strlen($i); $i=(string)$i; $sum=0; for($ ...
- MINA2.0原理
转自:http://blog.csdn.net/liuzhenwen/article/details/5894279 客户端通信过程 1.通过SocketConnector同服务器端建立连接 2. ...
- servletConfig对象
在Servlet的配置文件中,可以使用一个或多个<init-param>标签为servlet配置一些初始化参数. 当servlet配置了初始化参数后,web容器在创建servlet实例对象 ...
- [转载]大道至简！！！从SAP HANA作为SAP加速器的方式，看ERP on HANA的春天
I AM A ABAPER! 科技的进步,一定会使一些东西变得越来越精简! 大道至简!!! 文章很好!!!!!!!!!!! -------------------------------------- ...
- 理解asp.net中DropDownList编辑数据源，绑定数据库数据。
一.理解asp.net绑定数据库 终于学习到了连接数据库部分的内容,杨中科老师视频看起来挺轻松的,如果是高清版就更ok了. 我发现我学习新的编程语言会有一个特点,都想要赶紧学习数据库,数据就是一切,有 ...
- 5 Ways to Use Log Data to Analyze System Performance--reference
Recently we looked across some of the most common behaviors that our community of 25,000 users looke ...
- android开发之重写Application类
在android应用开发中,重写Application也算是比较常见的,以前开发的一些程序太过于简单,都不要重写这个类,但是在真正的商业开发中,重写Application类几乎是必做的. 为什么要重写 ...
- ueditor 添加微软雅黑字体 异常“从客户端中检测到有潜在危险的 request.form值”，解决
使用ueditor往数据库添加文本内容时,如果字体有css样式, <,>," 这些字符会导致报出异常信息:从客户端中检测到有潜在危险的 request.form值 因为这些字符有 ...
- c# 前端写代码的情况
<%for(int i=0;i<list_model.Count;i++) { %> <div style=" padding-left:35px;padding-r ...
- HttpWebRequest结合HtmlAgilityPack实现网页form提交
年前一个项目,需要在某个系统实现系统自动操作. 系统页面使用form提交,页面参数较多,也参数设计一系列计算逻辑,改动一个值,其他值自动改变. 传统方法使用正则表达式匹配参数,构建post参数进行请求 ...