HTML+CSS+JavaScript表单操作04章节幻灯片.pptVIP

表 单 操 作 Form对象 在BOM中，将HTML文档中的每一个表单看成是一个FORM对象，FORM对象又称为表单对象，通过表单和表单控件元素可以让用户实现输入文字、在列表框中选择项、提交数据等功能。 Form对象简介 在一个HTML文档中允许出现多个表单，每对form标签和/form都可以创建一个表单。BOM将每一个表单都看成是一个Form对象，并将所有的 Form对象都放在forms[]数组中，通过Document对象的forms属性返回该数组。 body form name=myForm1/form form name=myForm2/form /body document.forms[0] document.forms[1] 表单属性 Form对象的方法和事件 Form对象的方法只有两个，分别是reset()方法和submit()方法 查看表单的方法 form name=myForm id=myForm method=post target=_blank action=submit.html enctype=text/palin accept-charset=gb2312 姓名:input type=text name=myNamebr 密码:input type=password name=myPasswordbr input type=submit value=提交input type=reset value=重置 /form script var myForm=document.forms[0]; document.write(输入数据所有使用的字符集,myForm.acceptCharset,br); document.write(表单中的表单控件元素个数为,myForm.elements.length,个br); document.write(表单将提交到,myForm.action,文件br); document.write(提交表单时的编码方式为,myForm.encoding); document.write(表单的ID值为:,myForm.id,br); document.write(表单的长度为:,myForm.length,br); document.write(表单的提交方式为,myForm.method,br); document.write(表单的名称,myF,br); document.write(表单将提交到,myForm.target,窗口br); /script 将表单提交到不同的URL script function sendPage(){ //将数据提交到sumbmit.htm文件 myForm.action=submit.htm; //提交数据 myForm.submit(); } function sendEmail(){ //将数据提交到email中 myForm.action=mailto:admin@163.com; //设置提交数据时所使用的编码 myForm.encoding=multipart/form-data; //提交数据 myForm.submit(); } /script body form name=myForm method=post 姓名:input type=text name=myNamebr 建议:textarea name=myText/textareabr input type=button onclick=sendPage() value=提交到后台 input type=button onclcik=sendEmail() value=提交到负责人 /body 文本框事件 限制文本框中的输入字数 script //设置标题文本框的输入字数 function titleLimit(){//使用文本框对象的maxLength属性设置文本框中的输入字数 myForm.textTitle.maxLength=15; } function textLimit(){//设置内容文本框中的输入字数 var context=myForm.Context.value; //内容文本框中的文本 if(context.length100){//判断内容文本框中的字数是否大于100 alert(内容框中的文字不能超过100个字); //弹出提交框 context=context.substr(0,100); //截取前100个文字 myForm.Context.value=context; //设置内容文本框中的文本 } myForm.textCount.value=context.length; //设置字数文本框的文本 } on