JavaScript精简学习4(动态表单和链接处理)
2013-03-15 18:36
477 查看
JavaScript精简学习4:表单 43 表单构成 <form method=”post” action=”target.html” name=”thisForm”> <input type=”text” name=”myText”> <select name=”mySelect”> <option value=”1”>First Choice</option> <option value=”2”>Second Choice</option> </select> <br> <input type=”submit” value=”Submit Me”> </form> 44 访问表单中的文本框内容 <form name=”myForm”> <input type=”text” name=”myText”> </form> <a href='http://www.webjx.com/htmldata/2006-02-06/1139212451.html#' onClick='window.alert(document.myForm.myText.value);'>Check Text Field</a> 45 动态复制文本框内容 <form name=”myForm”> Enter some Text: <input type=”text” name=”myText”><br> Copy Text: <input type=”text” name=”copyText”> </form> <a href=http://www.webjx.com/htmldata/2006-02-06/”#” onClick=”document.myForm.copyText.value = document.myForm.myText.value;”>Copy Text Field</a> 46 侦测文本框的变化 <form name=”myForm”> Enter some Text: <input type=”text” name=”myText” onChange=”alert(this.value);”> </form> 47 访问选中的Select <form name=”myForm”> <select name=”mySelect”> <option value=”First Choice”>1</option> <option value=”Second Choice”>2</option> <option value=”Third Choice”>3</option> </select> </form> <a href='http://www.webjx.com/htmldata/2006-02-06/1139212451.html#' onClick='alert(document.myForm.mySelect.value);'>Check Selection List</a> 48 动态增加Select项 <form name=”myForm”> <select name=”mySelect”> <option value=”First Choice”>1</option> <option value=”Second Choice”>2</option> </select> </form> <script language=”JavaScript”> document.myForm.mySelect.length++; document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = “3”; document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = “Third Choice”; </script> 49 验证表单字段 <script language=”JavaScript”> function checkField(field) { if (field.value == “”) { window.alert(“You must enter a value in the field”); field.focus(); } } </script> <form name=”myForm” action=”target.html”> Text Field: <input type=”text” name=”myField”onBlur=”checkField(this)”> <br><input type=”submit”> </form> 50 验证Select项 function checkList(selection) { if (selection.length == 0) { window.alert(“You must make a selection from the list.”); return false; } return true; } 51 动态改变表单的action <form name=”myForm” action=”login.html”> Username: <input type=”text” name=”username”><br> Password: <input type=”password” name=”password”><br> <input type=”button” value=”Login” onClick=”this.form.submit();”> <input type=”button” value=”Register” onClick=”this.form.action = ‘register.html’; this.form.submit();”> <input type=”button” value=”Retrieve Password” onClick=”this.form.action = ‘password.html’; this.form.submit();”> </form> 52 使用图像按钮 <form name=”myForm” action=”login.html”> Username: <input type=”text” name=”username”><br> Password: <input type=”password”name=”password”><br> <input type=”image” src=http://www.webjx.com/htmldata/2006-02-06/”login.gif” value=”Login”> </form> 53 表单数据的加密 <SCRIPT LANGUAGE='JavaScript'> <!-- function encrypt(item) { var newItem = ''; for (i=0; i < item.length; i++) { newItem += item.charCodeAt(i) + '.'; } return newItem; } function encryptForm(myForm) { for (i=0; i < myForm.elements.length; i++) { myForm.elements.value = encrypt(myForm.elements.value); } } //--> </SCRIPT> <form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'> Enter Some Text: <input type=text name=myField><input type=submit> </form> 上面的encryptForm方法把表单中的数据转换为编码,在提交表单之前完成了简单的表单数据加密~
相关文章推荐
- javascript表单处理具体实现代码(表单、链接、按钮)
- JavaScript学习14:表单处理
- ASP之处理用Javascript动态添加的表单元素数据的代码
- JavaScript与 HTML表单的交互过程,想要学习动态网页但是无从下手的新手看看。
- ASP之处理用Javascript动态添加的表单元素数据的代码
- JavaScript与 HTML表单的交互过程,想要学习动态网页但是无从下手的新手看看。
- JavaScript精简学习4:表单
- javascript表单处理具体实现代码(表单、链接、按钮)
- ASP动态生成的javascript表单验证代码
- JavaScript高级程序设计学习笔记--事件(一)(事件流、事件处理程序/事件侦听器)
- 一步步学习微软InfoPath2010和SP2010--第四章节--处理SP列表表单(1)--SP列表基础
- 动态链接库的学习总结
- 一步步学习微软InfoPath2010和SP2010--第四章节--处理SP列表表单(4)--已计算值域
- 一步步学习微软InfoPath2010和SP2010--第五章节--添加逻辑和规则到表单(5)--处理节和条件格式
- JavaScript表单特殊输入处理收集
- JavaScript高级程序设计 错误处理与调试学习笔记
- ObjC学习4-多态、动态类型、动态绑定及异常处理
- JavaScript学习——使用JS完成注册页面表单校验
- javascript创建动态表单的方法
- 用ASP动态生成JavaScript的表单验证代码