Javascript经典案例javascript表单验证及事件

发布时间：2024-09-20

通过javascript实现表单验证和树形显示

讲

单验证

件

通过javascript实现表单验证和树形显示

录

1. 2. 3. 4.

通过javascript实现表单验证和树形显示

String对象对象常用的String对象对象常用的使用 var 语句 var newstr = "这是我的字符串" 创建 String 对象 var newstr = new String("这是我的字符串“) 调用方法和属性字符串对象.属性名字符串对象.方法名( )

通过javascript实现表单验证和树形显示

String对象对象String对象常用的属性和方法对象常用的属性和方法语法：语法： indexOf(“查找的子字符串”,查找的起始位置查找的子字符串” 查找的起始位置) 查找的子字符串名称返回子字符串所在的位置；如果没找到，返回子字符串所在的位置；如果没找到，返回 -1 例如：例如： length 属性 var x var y=“abcdefg”; indexOf(“子字符串子字符串” 起始位置) 方法 x=y.indexOf(“c” , 0 ); 子字符串”,起始位置 //返回结果为，起始位置是返回结果为2,起始位置是0 返回结果为 charAt(index)

说明获取字符串字符的个数查找子字符串的位置获取位于指定索引位置的字符截取两个索引位置之间的字符串将字符串转换成小写将字符串转换成大写

substring(index1,index2 )toLowerCase( ) toUpperCase( )

通过javascript实现表单验证和树形显示

数值判断函数数值判断函数功能：判断变量的值是否为数值，“NaN”代表 “Not a Number”,若返回值为true,则表示自变量不是数值。语法：isNaN(测试值)

通过javascript实现表单验证和树形显示

数学(Math)对象对象数学数学(Math)对象对象数学方法：方法： abs() 返回某数的绝对值 acos() 返回某数的反余弦值以弧度为单位返回某数的反余弦值(以弧度为单位以弧度为单位) asin() 返回某数的反正弦值以弧度为单位返回某数的反正弦值(以弧度为单位以弧度为单位) atan() 返回某数的反正切值以弧度为单位返回某数的反正切值(以弧度为单位以弧度为单位) ceil() 返回大于或等于指定数的最小整数 floor() 与ceil相反相反 max() 返回两数间的较大值 min() 返回两数间的较小值 pow() 返回的n次方其中为底为指数返回m的次方其中,m为底为指数) 次方(其中为底,n为指数 random() 返回和1之间的一个伪随机数返回0和之间的一个伪随机数 round() 返回某数四舍五入之后的整数

通过javascript实现表单验证和树形显示

日期时间(Date)对象对象日期时间格式：对象名 = new Date ( [日期参数] ) 举例： today = new Date () //以当日时间为对象初值。

通过javascript实现表单验证和树形显示

日期时间(Date)对象方法对象方法: 日期时间对象方法getYear()返回年份值 getMonth() 返回月份值 getDate() 并返回日期 getDay() 返回星期几 getHours() 返回小时数 getMinutes() 返回分钟数 getSeconds() 返回秒数 getTime() 返回完整的时间 setDate() 改变Date对象的日期 setHours() 改变小时数 setMinutes() 改变分钟数 setMonth() 改变月份 setSeconds() 改变秒数 setTime() 改变完整的时间 setYear() 改变年份 setTimeout 按照间隔时间(

毫秒)来调用函数

通过javascript实现表单验证和树形显示

日期时间(Date)对象对象日期时间月份数为(0---11) 日期数为(1---31) 星期数为(0----6) 小时数为(0---23) 分钟数为(0---59) 秒数为 (0---59) 毫秒数为(0---999)

通过javascript实现表单验证和树形显示

Date对象做时钟显示对象做时钟显示<SCRIPT language="javaScript"> function disptime( ) 获得当前日期和时间 { var now= new Date( ) ; var hour = now.getHours() ; 获得小时，获得小时，即当前是几点 if (hour>=0 && hour <=12) document.write("<H2>上午好上午好!</H2>") 上午好 if (hour>12 && hour<= 18) 月份数字 document.write("<H2>下午好下午好!</H2>") ; 下午好判断上午、判断上午、下午还是晚上 0-11, - , if (hour>18 && hour <24) 注意+ 注意+1 document.write("<H2>晚上好晚上好!</H2>") ; 晚上好 document.write("<H2>今天日期今天日期:"+now.getYear()+"年今天日期年 "+(now.getMonth( )+1)+"月"+now.getDate()+"日</H2>") ; 月日 document.write("<H2>现在时间现在时间:"+now.getHours()+"点现在时间点 "+now.getMinutes( )+"分</H2>") ; } 分 </SCRIPT> <BODY onload="disptime( )">

通过javascript实现表单验证和树形显示

Date对象做时钟显示对象做时钟显示上一页PPT示例中时钟不能动态改变，怎么办？示例中时钟不能动态改变，怎么办？上一页示例中时钟不能动态改变

由于时间在不停地走，所以应该每隔秒调用显示时间由于时间在不停地走，所以应该每隔1秒调用显示时间的方法。如何解决？的方法。如何解决？使用setTimeout( )方法每隔1秒调用显示时间的方法使用方法每隔秒调用显示时间的方法方法每隔

每隔1000毫秒执行函每隔毫秒执行函 setTimeout的用法：的用法：的用法一次 setTimeout(“调用的函数”,”定时的时间”数disptime( )一次定时的时间” ( 调用的函数” 定时的时间 ) 例：var myTime=setTimeout( “disptime( )”, 1000 ) ; =

通过javascript实现表单验证和树形显示

Date对象做时钟显示对象做时钟显示

<SCRIPT language="JavaScript"> function disptime( ){ var time = new Date( ); //获得当前时间获得当前时间 var hour = time.getHours( ); //获得小时、分钟、秒获得小时、获得小时分钟、设置文本框的内容 var minute = time.getMinutes( ); 为当前时间 var second = time.getSeconds( ); document.myform.myclock.value =hour+":"+minute+":"+second+" " ; var myTime = setTimeout("disptime()",1000); } </SCRIPT> 设置定时器每隔1秒设置定时器每隔秒 <BODY onLoad="disptime( )"> (1000毫秒调用函数毫秒),调用函数毫秒 <FORM NAME="myform"> disptime()执行执行 <H2>当前时间：当前时间：当前时间 <INPUT name="myclock" type="text" value="" size="10" > </H2></FORM > </BODY>

通过javascript实现表单验证和树形显示

小结2 小结编写如左图所示，编写如左图所示，具有在网页中指定位置显示动态时钟效果的页面。置显示动态时钟效果的页面。

自动动态变化的时钟

通过javascript实现表单验证和树形显示

为什么需要表

单验证用户输入客户端

IE用户输入客户端

……

……用户输入客户端

服务器

脚本在客户端执行，脚本在客户端执行，减轻服务器端的压力

通过javascript实现表单验证和树形显示