js进阶-9-3/4 form对象有哪些常用属性 一.总结 一句话总结: 1.一般html标签有哪些常用属性:name id value 2.form对象有哪些常用属性(特有):action method 1.注意: 1.element的属性可以取值,大部分也可以赋值的情况.属性存取两用.myformElement.method='post' 1.怎么实现将表单提交到不同的URL? 解答:用form的submit方法.function sendPage2(){                  …
js进阶正则表达式14验证邮编(input的pattern属性)(正则表达式加起^始$) 一.总结 1.input的pattern属性:里面可以直接放正则表达式,<input type="text" id="yzbm" name="yzbm" pattern="^\d{6}$"> 2.正则表达式加起^始$:var reg=/^\d{6}$/ 二.js进阶正则表达式14验证邮编 练习1:验证邮政编码 实例描述: 验证…
js sort方法根据数组中对象的某一个属性值进行排序 sort方法接收一个函数作为参数,这里嵌套一层函数用来接收对象属性名,其他部分代码与正常使用sort方法相同. var arr = [ {name:'zopp',age:0}, {name:'gpp',age:18}, {name:'yjj',age:8} ]; function compare(property){ return function(a,b){ var value1 = a[property]; var value2 = b…
// js如何判断一个对象{}是否为空对象,没有任何属性 if (typeof model.rows === "object" && !(model.rows instanceof Array)){ var hasProp = false; for (var prop in model.rows){ hasProp = true; break; } if (hasProp){ model.rows = [model.rows]; }else{ throw "m…
sort方法接收一个函数作为参数,这里嵌套一层函数用来接收对象属性名,其他部分代码与正常使用sort方法相同. var arr = [ {name:'zopp',age:0}, {name:'gpp',age:18}, {name:'yjj',age:8} ]; function compare(property){ return function(a,b){ var value1 = a[property]; var value2 = b[property]; return value1 -…
视频:https://gorails.com/episodes/form-objects-design-pattern?autoplay=1 git代码 :https://github.com/gorails-screencasts/gorails-episode-179/blob/master/app/models/contact_form.rb 生成自定义的和复杂的表格的一种设计风格: 特色:更好的组织了复杂表格. 自定义一个model: 自定义的model的生成的对象,就是form对象.它…
js进阶 9-5 js如何确认form的提交和重置按钮 一.总结 一句话总结: 1.这个并不好做:onsubmit 里面的代码必须返回false才能取消onsubmit方法的执行,所以,有return.注意:一般的调用肯定是没有return的.onsubmit="return queren()" 2.onsubmit="return queren()" 这句话的意思的form的submit方法调用return queren() 这段代码.这里可以是个函数,也可以是一…
js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标签跳转,比如点submit提交 2.如何阻止元素的默认事件? event.preventDefault() 阻止事件的默认动作. 26 //阻止默认行为 27 $('#aid').click(function(e){ 28 //e.preventDefault() 29 alert(e.isDefa…
js进阶ajax的XMLHttpRequest对象的status和statustext属性(如果ajax和php联合使用的话:open连接服务器的第二个参数文件路径改成请求php的url即可) 一.总结 1.XMLHttpRequest的responseText接收到获取的数据 2.XMLHttpRequest的statusText属性得到服务器状态相关的文本(另外的属性) 如果ajax和php联合使用的话:open的第二个参数文件路径改成请求php的url即可 xmlhttp.open("GE…
js进阶正则表达式实现过滤字符串(RegExp对象操作正则表达式)(正则:regular)(表达式:expression) 一.总结 1.str_replace:正则作用:高效快速匹配 2.break关键字 3.RegExp对象操作正则表达式 (正则:regular) ['regjʊlə] (表达式:expression) [ɪkˈspreʃn] 二.js进阶正则表达式实现过滤字符串 <!DOCTYPE html> <html lang="zh-cn"> <…
js进阶正则表达式13RegExp对象方法(RegExp对象的方法:compile,test,exec)(子表达式 var reg1=/([a-z]+)\d/) 一.总结 1.RegExp对象有三个方法:compile(编译正则表达式),test(检索字符串中指定的值),exec(检索字符串中指定的值)(和string对象的match有点类似) . 2.子表达式:分组的表达式,也就是小括号括起来的表达式,var reg1=/([a-z]+)\d/ 其中([a-z]+)就是字表达式 二.js进阶正…
js进阶正则表达式11RegExp的属性和方法(RegExp的属性和方法,就是RegExp对象.(点)什么的形式)(正则表达式执行之前会被编译) 一.总结 1. RegExp的属性和方法,就是RegExp对象.(点)什么的形式 2.正则表达式执行之前会被编译 二.js进阶正则表达式11RegExp的属性和方法 RegExp 对象属性 global RegExp 对象是否具有标志 g. 语法:RegExpObject.global 如果 g 标志被设置,则该属性为 true,否则为 false.…
js进阶正则表达式10-分组-多行匹配-正则对象的属性(小括号作用:分组,将小括号里面的东西看成一个整体,因为量词只对前一个字符有效)(多行匹配:m)(属性使用:reg.global) 一.总结 1.小括号作用:分组,将小括号里面的东西看成一个整体,因为量词只对前一个字符有效 var reg2=/(td){2,4}/g //1.小括号作用,分组 2.var reg3=/^\d/gm //2.m多行匹配 var str2='1.第一章\n2.第二章\n3.第三章' //4.换行符 3.alert(…
1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> <meta charset="UTF-8"></meta> <title></title> <script type="text/javascript"> // BOM:浏览器对象,broswer object…
一.结构顺序大体介绍 JavaScript代码的整个执行过程,分为两个阶段,代码编译阶段与代码执行阶段. 编译阶段由编译器完成,将代码翻译成可执行代码,这个阶段作用域规则会确定. 执行阶段由引擎完成,主要任务是执行可执行代码,执行上下文在这个阶段创建.执行上下文也分为创建阶段和执行阶段. 1.首先进入全局环境,创建一个全局执行上下文,全局变量对象window,全局作用域Global,确定this指向,this==window. 2.在执行阶段,会完成变量赋值,函数引用,以及执行其他代码等.浏览器…
阅读目录 什么是Form组件 常用字段和插件 自定义校验的方式 补充进阶 一.什么是Form组件 我们之前在HTML页面中利用form表单向后端提交数据时,都会写一些获取用户输入的标签并且用form标签把它们包起来. 与此同时我们在好多场景下都需要对用户的输入做校验,比如校验用户是否输入,输入的长度和格式等正不正确. 如果用户输入的内容有错误就需要在页面上相应的位置显示对应的错误信息.. Django form组件就实现了上面所述的功能. 总结一下,其实form组件的主要功能如下: 生成页面可用…
js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这8个板块. 二.jquery的ajax有哪些函数和事件 JAX是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新.如果没有jQuery,AJAX编程还是有些难度的.通过jQuery AJAX方法,能够使用HTTP Get和HTTP Post 从远程服务器上请求文本.HTML…
js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么 一.总结 一句话总结:两者都是对表单进行序列化,serializeArray()返回的是json对象,serialize()返回的是json形式的字符串,使用起来都是一样的 1.$(selector).serialize()序列化的话对中文做了什么操作? 为了避免出错,将中文变成了编码,因为内容要提交到服务器,编码可以保证汉字不出错,github上传文件的时候,也是进行的同样的操作…
js进阶 14-7 jquery的ajax部分为什么需要对表单进行序列化 一.总结 一句话总结:如果用ajax传递表单的数据,如果不进行表单的序列化,要一个参数一个参数的写,太麻烦,序列化的话,一句代码搞定.data:$('form').serialize(),这样一句话解决复杂的表单ajax的post传值过程. 1.表单序列化函数是什么? $(selector).serialize()和serializeArray() 24 <script> 25 $(function(){ 26 $('f…
js进阶 12-14 jquery的事件触发函数是哪两个 一.总结 一句话总结:trigger和triggerHandler 1.trigger传额外参数时候的注意事项是什么? 注意样例中是三个参数 1.传的参数写在trigger的第二个参数2.如果要传多个参数,用数组方式 31 //trigger的额外数据 32 //多条数据时候需要放到[]中 33 $('#btn1').on('click', 34 300,function(e,data1,data2){ 35 alert('trigger…
js进阶 9 js操作表单知识点总结 一.总结 一句话总结:熟记较常用的知识点,对于一些不太常用的知识点可以在使用的时候查阅相关资料,在使用和练习中去记忆. 1.表单中学到的元素的两个对象集合石什么? elements和options 2.对象集合,所有的集合怎么使用? [i],数组访问方式,比如第i个,options[i] 3.表单中最最常见和常用的是那个属性? length 4.表单text对象的三个重要方法是哪三个? blur focus select 5.select对象的两个独特方法是…
js进阶 9-14 js如何实现下拉列表多选移除 一.总结 一句话总结: 1.js如何实现下拉列表多选移除? 把这个下拉列表中的option移除,然后加到另外一个下拉列表(文字)中去.remove方法和add方法 2.option的哪个属性可以获得文本值? text属性 3.js传参的过程中如何传element? 这种传参方式真的可以借鉴,onclick="jh(document.form1.sel_2,document.form1.sel_1)" 二.js进阶 9-14  js实现下…
js进阶 9-12  js如何实现级联菜单 (章节测试) 一.总结 一句话总结: 1.js如何实现级联菜单 ? 二维数组,以第一级菜单的文本值做键,以对应的二级菜单选项的文本做值 2.用哪个属性可以获取一个元素的文本值? text 二.js进阶 9-12  js实现级联菜单 1.案例说明:多级联菜单 使用二维数组和下拉菜单相结合,实现多级联动菜单 2.相关知识点:Select 下拉列表 Select 对象集合 options[]返回包含下拉列表中的所有选项的一个数组 Select对象属性 len…
js进阶 9-12 如何将数组的信息添加到下拉列表 一.总结 一句话总结:创建出select的option,然后selectElement的add方法加进 selectElement 即可 1.创建出select的option的两种方法: new option() 和 createElement('option') 二.js进阶 9-12 如何将数组的信息添加到下拉列表 1.案例说明:数组数据添加到下拉列表 使用二维数组和下拉菜单相结合,实现多级联动菜单 使用createElement的方法 2…
js进阶 9-11 select选项框如何动态添加和删除元素 一.总结 一句话总结: 二.js进阶 9-11 select选项框如何动态添加和删除元素 1.案例说明 2.相关知识 Select 下拉列表 Select 对象集合 options[]返回包含下拉列表中的所有选项的一个数组 Select对象属性 length返回下拉列表中的选项数目 multiple 设置或返回是否选择多个项目. selectedIndex 设置或返回下拉列表中被选项目的索引号. size 设置或返回下拉列表中的可见行…
js进阶 9-10  html控件如何实现点击自动选择控件内容 一.总结 一句话总结: 1.在click事件中,如果focus,那就select 2.blur 1.html中控件添加两种方式? 在表单中加方法的方式就不用再去选择元素了 事件的两会两种方式: 知控件方式:在控件中直接调用事件 不知控件方式:选择到控件,然后添加时间 2.html控件常用的事件(五种)? click focus blur select change 3.html中blur事件是干嘛的? 从文本域上移开焦点 4.htm…
js进阶 9-9 html控件如何实现回车键切换焦点 一.总结 一句话总结:在onkeydown事件中判断event对象的键位码,然后focus事件. 二.js进阶 9-9 html控件如何实现回车键切换焦点 1.案例描述 回车键切换焦点 案例要点:在表单中经常会用到按回车键自动切换焦点的功能,该功能主要用到focus()事件已经键盘事件 2.相关知识点 Text 对象方法 blur()从文本域上移开焦点 Focus()在文本域上设置焦点 Select()选取文本域中的内容. 3.代码 <!DO…
js进阶 9-10  html中单选框和多选框如何遍历下拉列表 一.总结 一句话总结: 1.select元素的options.length可以获取选择长度,然后用options[i]精确定位到选项,用选项元素的selected属性判断选项是否选中,选项的text属性获取选项内容. 2.textarea的value属性获取teaxtarea里面的值 二.js进阶 9-10  html中如何遍历下拉列表 1.案例描述 遍历下拉列表 2.相关知识点 Select 下拉列表 Select 对象集合 op…
js进阶 9-6 js如何通过name访问指定指定表单控件 一.总结 一句话总结:form中控件的三种访问方式:2formElement 1document 1.form中控件的三种访问方式? 1.form中的控件可以通过formElement.控件名字的方式获取:form1.username.value 2.form控件获取传统方式:document.getElement方式 3.form控件通过formElement的elements属性方式获取:formElement的elements列表…
一,css进阶篇: 等css哪些事儿看了两三遍之后,需要对看过的知识综合应用,这时候需要大量的实践经验, 简单的想法:把qq首页全屏另存为jpg然后通过ps工具切图结合css转换成html,有无从下手的地方可以用firebug, chrome调试工具分析网站结构样式.如果技术熟练自信可以自己先写,写完之后在对比,以其来找寻自己的差距.结构是网站的骨架,如果写的不合理,将是bug产生的重要根源,所以学习分析大型网站的布局样式对初学者来说帮助是很大的.大多数初学者由于对技术的不自信,html结构往往…