jQuery
dom事件绑定：
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <style>
7 /* item样式 */
8 .item{
9 width: 250px;
10 height: 60px;
11 position: relative;
12 }
13 .item input{
14 width: 200px;
15 }
16 .item span{
17 position: absolute;
18 top: 20px;
19 left: 0px;
20 font-size: 8px;
21 background-color: indianred;
22 color: white;
23 display: inline-block;
24 width: 200px;
25 }
26 </style>
27
28 </head>
29 <body>
30 <div>
31 <form>
32 <div class="item">
33 <!--样式c1，type为text，label为自定义属性-->
34 <input class="c1" type="text" name="username" label="用户名"/>
35 <!--<span>用户名不能为空</span>-->
36 </div>
37 <div class="item">
38 <input class="c1" type="password" name="pwd" label="密码"/>
39 <!--<span>密码不能为空</span>-->
40 </div>
41 <input type="submit" value="提交" onclick="return CheckValid();" />
42 </form>
43 </div>
44 <script src="jquery-1.12.4.js"></script>
45 <script>
46 function CheckValid() {
47 // 找到form标签下的所有需要验证的标签
48 // $("from .c1")
49 // $(‘from input[type="text"], form input[type="password"]‘)
50 // 循环所有需要验证的标签，获取内容
51
52 // 每次提交前清除上次验证结果
53 $(‘from .item span‘).remove();
54
55 // 定义flag为true，验证
56 var flag = true;
57 $(‘form .c1‘).each(function () {
58 // 每个元素执行一次匿名函数
59 // this
60 // console.log(this, $(this));
61 var val = $(this).val();
62 // 判断长度
63 if(val.length<=0){
64 var label = $(this).attr(‘label‘);
65 var tag = document.createElement(‘span‘)‘‘;
66 tag.innerText = label + "不能为空";
67 $(this).after(tag);
68 flag = false;
69 }
70 });
71 // 返回flag值
72 return flag
73 }
74 </script>
75
76 </body>
77 </html>
dom事件绑定
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <style>
7 /* item样式 */
8 .item{
9 width: 250px;
10 height: 60px;
11 position: relative;
12 }
13 .item input{
14 width: 200px;
15 }
16 .item span{
17 position: absolute;
18 top: 20px;
19 left: 0px;
20 font-size: 8px;
21 background-color: indianred;
22 color: #ffffff;
23 display: inline-block;
24 width: 200px;
25 }
26 </style>
27
28 </head>
29 <body>
30 <div>
31 <form>
32 <div class="item">
33 <!--样式c1，type为text，label为自定义属性-->
34 <input class="c1" type="text" name="username" label="用户名"/>
35 <!--<span>用户名不能为空</span>-->
36 </div>
37 <div class="item">
38 <input class="c1" type="password" name="pwd" label="密码"/>
39 <!--<span>密码不能为空</span>-->
40 </div>
41 <!--<input type="submit" value="提交" onclick="return CheckValid();" />-->
42 <input type="submit" value="提交" />
43 </form>
44 </div>
45 <script src="jquery-1.12.4.js"></script>
46 <script>
47 $(function () {
48 // 当页面框架加载完成之后，自动挂靠
49 BindCheckValid();
50 });
51
52 function BindCheckValid() {
53 $(‘form :submit‘).click(function () {
54
55 $(‘form .item span‘).remove();
56
57 // 定义flag为true，验证
58 var flag = true;
59 $(‘form .c1‘).each(function () {
60 // 每个元素执行一次匿名函数
61 // this
62 // console.log(this, $(this));
63 var val = $(this).val();
64 // 判断长度
65 if(val.length<=0){
66 var label = $(this).attr(‘label‘);
67 var tag = document.createElement(‘span‘);
68 tag.innerText = label + "不能为空";
69 $(this).after(tag);
70 flag = false;
71 }
72 });
73 // 返回flag值
74 return flag;
75 });
76 }
77 </script>
78
79 </body>
80 </html>
jquery事件绑定
$each return false 标示break
<script>
$(function () {
// 当页面框架加载完成之后，自动挂靠
BindCheckValid();
});
function BindCheckValid() {
$(‘form :submit‘).click(function () {
$(‘form .item span‘).remove();
// 定义flag为true，验证
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;
}
});
// 返回flag值
return flag;
});
}
自定义jQuery扩展的方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="jquery-1.12.4.js"></script>
<script src="extend1.js"></script>
<script>
// $ == jQuery
$.dalong1(‘222222‘);
</script>
</body>
</html>
扩展文件：/**
* Created by think on 2016/8/28.
*/
(function (jq) {
jq.extend({
‘dalong1‘: function (arg) {
console.log(arg);
}
});
function f1() {
}
})(jQuery)
jquery扩展实现验证：
l 支持是否允许为空
l 长度
l 正则表达式
定义正则表达式
reg = /正则表达式/ *****
g
i
m ===> 特殊
利用正则匹配
reg.test(字符串) *****
reg.exec(字符串)
全局
非全局
字符串三个方法：
search
match
replace
----特殊符号
滚动菜单：
页面布局（absolute）
监听滚动
前端插件：
? fontawsome ? easyui: http://www.jeasyui.net/ ? Bootstrap: http://v3.bootcss.com/ ? 引入css ? 引入jQuery（2.x,1.12） ? 引入js ? bootstartrap模版 ? bxslider ? jquery.lazyload: http://www.cnblogs.com/wupeiqi/articles/5813161.html
django
针对python的web 框架的实现分为两种：
1、Tornado自带的web框架，2、以django为代表的web框架，它是基于wsgi模块的。
MVC/MTV分类其实就是目录的归类：
| WEB框架 | 处理用户请求 | 放置HTML模板 | 操作数据库 | 框架 |
| MVC | Controller | Views | Modals | |
| MVT | Views | Template | Modals | django |
时间： 2024-11-09 06:06:11