常见问题及解决方案(前端篇)
一、jquery validate
默认校验规则
序号 规则 描述
1 required=true 必须输入的字段。
2 remote= "check.php" 使用 ajax 方法调用 check.php 验证输入值。
3 email=true 必须输入正确格式的电子邮件。
4 url=true 必须输入正确格式的网址。
5 date=true 必须输入正确格式的日期。日期校验 ie6 出错,慎用。
6 dateISO=true 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22。只验证格式,不验证有效性。
7 number=true 必须输入合法的数字(负数,小数)。
8 digits="true" 必须输入整数。
9 creditcard="" 必须输入合法的信用卡号。
10 equalTo:"#field" 输入值必须和 #field 相同。
11 accept= 输入拥有合法后缀名的字符串(上传文件的后缀)。
12 maxlength=5 输入长度最多是 5 的字符串(汉字算一个字符)。
13 minlength=10 输入长度最小是 10 的字符串(汉字算一个字符)。
14 rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串(汉字算一个字符)。
15 range:[5,10] 输入值必须介于 5 和 10 之间。
16 max=5 输入值不能大于 5。
17 min=10 输入值不能小于 10。
附原文路径:http://www.runoob.com/jquery/jquery-plugin-validate.html
二、Jquery 选择器
Jquery 选择器
1、基本选择器
a.ID选择器(#ID名称)
b.样式选择器(.样式名称)
c.标签选择器(标签名称)
2.符合选择器
a.交集选择器(并且)
多种选择器(li.class)
b.并集选择器(或者)
多种选择器之间添加(h2,h1)
c.后代选择器(后代选择器) (ul span)
d.子带选择器,只选择直接后代节点,第二级节点
e.属性选择器 $("li[name='age']")
3.过滤选择器
a.按下标过滤选择器(eq lt gt)
b.属性过滤
附原文路径:http://jquery3.2.1.com
三、js callback函数理解:
回调函数,就是放在另外一个函数(如 parent)的参数列表中,作为参数传递给这个 parent,然后在 parent 函数体的某个位置执行。说来抽象,看例子:
1 // To illustrate the concept of callback 2 var doit = function(callback) 3 { 4 var a = 1, 5 b = 2, 6 c = 3; 7 var t = callback(a,b,c); 8 return t + 10; 9 }; 10 var d = doit(function(x,y,z){ 11 return (x+y+z); 12 }); 13 console.log(d);
先定义 doit 函数,有一个参数 callback。这个 callback 就是回调函数,名字可以任意取。看函数体,先定义三个变量 a,b,c。然后调用 callback 函数。最后返回一个值。
下面就调用 doit 函数了。要注意的是,刚才定义 doit 时,callback 并没有定义,所以刚才并不知道 callback 是干什么用的。这其实很好理解,我们平时定义函数的时候,参数也只是给出了一个名字,比如 a,在函数体中使用 a,但整个过程也并不知道 a 到底是什么,只有在调用那个函数的时候才指定 a 的具体值,比如2.回过头来,在调用 doit 的时候,我们就需要指定 callback 究竟是个什么东西了。可以看到,这个函数完成了一个 sum 功能。
上述代码的执行过程是:
调用 doit函数,参数是一个匿名函数;进入 doit 的函数体中,先定义 a,b,c,然后执行刚才的匿名函数,参数是 a,b,c,并返回一个 t,最后返回一个 t+10给 d。
四、js获取html元素的宽度高度及相对位置
精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
五、js三元运算符
如名字表示的三元运算符需要三个操作数。
语法是 条件 ? 结果1 : 结果2;. 这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2。满足条件时结果1否则结果2。
1 <script type="text/javascript"> 2 var b=5; 3 (b == 5) ? a="true" : a="false"; 4 document.write(" --------------------------- "+a); 5 </script>
结果: --------------------------- true
1 <script type="text/javascript"> 2 var b=true; 3 (b == false) ? a="true" : a="false"; 4 document.write(" --------------------------- "+a); 5 </script>
结果: --------------------------- false
六、js属性及方法
Math.round(x) 四舍五入最接近的整数,参数x必须是数字。
setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
语法
setTimeout(code,millisec)
参数 描述
code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数。
javascript的方法可以分为三类:
a 类方法
b 对象方法
c 原型方法
z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
注释:元素可拥有负的 z-index 属性值。
注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!
说明
该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴。如果为正数,则离用户更近,为负数则表示离用户更远。
默认值: auto
继承性: no
版本: CSS2
JavaScript 语法: object.style.zIndex="1"
转载于:https://www.cnblogs.com/laowangc/p/8921247.html
常见问题及解决方案(前端篇)相关推荐
- 表单html遇到的问题及处理,Web前端开发中常见问题及解决方案
Web前端开发中常见问题及解决方案 时间:2017-04-24 来源:web前端开发小赢家 作为一名web前端开发工程师,我们在工作时免不了会遇到各种各样的问题.因为web前端开发相对于Jav ...
- 【转】常见浏览器兼容性问题与解决方案css篇
小满语:说到兼容性问题,不得不说一下IE浏览器,尤其是IE9以前,兼容性差的要哭,来,擦擦眼泪,学习一下兼容性问题的解决方案~本篇主要是布局后加样式后导致浏览器显示不统一的情形: 所谓的浏览器兼容性问 ...
- XHTML CSS 常见问题和解决方案
作为前端开发人员,在日常的页面制作时,不可避免的会碰上这样那样的问题,这时就需要寻找这些 XHTML及CSS常见问题的解决方案.我根据自己的经验和心得挑选和整理了一些XHTML常见问题和CSS常见问题 ...
- 红薯微剧场 | 开源众包发包记第一集 —— 前端篇
开源众包发包记 ---玩转众包 第一集 巧引外援.顺度难关---前端开发项目篇 丁酉年11月,北京的天气已经逐渐寒凉,部分办公司的灯光已熄灭,办公室的窗户上印衬着佳佳略显倦怠的容颜.虽然小风 ...
- 移动端常见问题及解决方案
移动端常见问题及解决方案 转载来源: 益享天开 >> 手机移动端web前端常见问题整理 一 .meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面<meta n ...
- Web Service 安全性解决方案(SOAP篇)
拼吾爱程序人生 » 软件编程 » Visual Studio.NET » Web Service » Web Service 安全性解决方案(SOAP篇) Web Service 安全性解决方案(SO ...
- OpenStack环境搭建(六:常见问题及解决方案总结)
实验要求: 完成Virtual box平台安装,会应用相关操作: 在virtual box虚拟平台上部署Fuel Master节点: 在virtual box虚拟平台上部署计算节点Computer: ...
- ESXi6.5环境搭建(五:常见问题及解决方案实验总结)
实验目的及要求 完成VMware workstations安装,会应用相关操作: 完成虚拟机中ESXI6.5平台的安装及网络环境配置: 完成VMware vSphere Client 6.0软件在PC ...
- C#中使用WCF一些常见问题及解决方案
C#中使用WCF一些常见问题及解决方案 参考文章: (1)C#中使用WCF一些常见问题及解决方案 (2)https://www.cnblogs.com/52XF/p/3740326.html 备忘一下 ...
- gulp几个常见问题及解决方案
gulp几个常见问题及解决方案 参考文章: (1)gulp几个常见问题及解决方案 (2)https://www.cnblogs.com/hjson/p/10546708.html 备忘一下.
最新文章
- 组合计数 ---- Codeforces Round #370 (Div. 2)D. Memory and Scores[dp]
- Winform开发框架之系统重新登录、自动登录实现
- 手把手教你玩转ARP包(一)
- python numpy中sum()时出现负值
- vm+ubuntu联网
- Mysql like ' ' 会不会用到索引
- JSON C# Class Generator ---由json字符串生成C#实体类的工具(转)
- feign返回结果统一处理_SpringCloud异常处理统一封装我来做-使用篇
- 音频3A测试 AGC自动增益测试
- 台式计算机模拟软件,仿真软件 计算机仿真模拟常用软件有那些?
- 2 分钟玩转 Apizza,轻量级 API 工具
- 1.ECMAScript 6简介(阮一峰ES6)
- [渝粤教育] 西安交通大学 土力学 参考 资料
- 计算机网络设计——企业网络规划与搭建
- Eclipse在桌面上创建的快捷方式打不开
- 梦幻西游ps计算机,五开选择PS与NE:那是因为效率高的缘故
- 衣服挂牌 挂牌吊牌(麻绳,五彩绳,尼龙绳等)
- 【数字水印】基于matlab DFT数字水印嵌入提取攻击【含Matlab源码 2320期】
- 跟卖亚马逊跨境电子商务ERP
- html中的函数怎么显示变量,css - 原生变量及使用函数 var()
热门文章
- linux下log日志乱码_如何用 Linux 技巧大大提高工作效率?
- C语言oj中a b怎么做,【HDUOJ】第1002题 A + B Problem II 纯C语言解法
- android studio gradle 学习,学习Android Studio里的Gradle
- php数字取反,[转+自]关于PHP7的新特性(涉及取反和disabled_functions绕过)
- leetcode 700. 二叉搜索树中的搜索 思考分析
- CDMA的完整形式是什么?
- 大数问题(C++、Java)
- 周易Java_周易API接口_免费数据接口 - 极速数据
- uva 1331——Minimax Triangulation
- 【计算机网络】网络基础