表单和javascript.pptVIP

表单事件与JavaScript 表单对象示例 表单元素事件 文本域事件 按钮事件 复选框事件 单选按钮事件 文本域事件 事件 onFocus onBlur onChange 用法 文本域事件示例 命令按钮事件 事件 onClick 用法 命令按钮事件示例 复选框事件 事件 onClick 用法 复选框事件示例 单选按钮事件 事件 onClick 用法 表单有效性验证 什么是表单有效性验证 在用户在表单中输入的内容提交到服务器之前，在客户端利用表单元素产生的事件，运用脚本(JavaScript)，校验用户输入的数据的有效性 表单有效性验证的优点 在客户端验证，速度快 减轻服务器端压力 应用举例 表单验证应用实例 总结 表单用于与用户进行交互 在表单中可以捕获表单元素事件 文本域事件 命令按钮事件 复选框事件 单选框事件 利用表单元素事件进行用户输入有效性校验 * * 熊燕帆 HTML HEAD TITLE使用表单对象标记/TITLE /HEAD BODY BGCOLOR=#FFFFFF Form ACTION=Simple.html method=post name=form1 pinput type=text size=20 name=name pinput type=button value=提交查询 onClick=form1.submit(); input type=reset value=重置 /FORM /BODY /HTML input type=text name=名称 size=宽度 onFocus=接受焦点处理例程; onBlur=失去焦点处理例程; onChange=改变内容处理例程; HTML HEAD TITLE文本域对象的事件/TITLE SCRIPT LANGUAGE=JavaScript function writeIt(value) { alert(value); } /SCRIPT /HEAD BODY BGCOLOR=#FFFFFF Form name=myfm input type=text name=first_text onFocus=writeIt(焦点);  onBlur=writeIt(模糊); onChange=writeIt(修改); TEXTAREA NAME=txt_area ROWS=10 COLS=10/TEXTAREA /FORM /BODY /HTML input type=button value=值 name=名称 onClick=单击事件处理例程; HTML HEAD TITLE按钮对象的事件/TITLE图10.3a：示例3的输出结果 SCRIPT LANGUAGE=JavaScript function writeIt(value) { myfm.second_text.value=value; } /SCRIPT /HEAD BODY BGCOLOR=#FFFFFF Form name=myfminput type=text name=first_text INPUT TYPE=button value=复制 onClick=writeIt(myfm.first_text.value); input type=text name=second_text /FORM /BODY /HTML input type=checkbox value=值 name=名称 checked onClick=单击事件处理例程; HTMLHEADTITLE复选框对象的事件/TITLE SCRIPT LANGUAGE=JavaScript function switchLight() { var the_box = window.document.form_2.check_1; var the_switch = ; if (the_box.checked == false) { alert(请把灯打开！); document.bgColor=black; } else { alert(谢谢！); document.bgColor=white; } } /SCRIPT /HEAD BODY BGCOLOR=#FFFFFF form name=form_2 in