45fan.com - 路饭网

搜索: 您的位置主页 > 网络频道 > 阅读资讯:操作Javascript表单域的技巧介绍

操作Javascript表单域的技巧介绍

2016-08-27 05:20:52 来源:www.45fan.com 【

操作Javascript表单域的技巧介绍

Javascript操作表单域的两个重要技巧Byshawl.qiu


说明:
技巧一:
当表单提交或重置时向客户端进行确认操作

技巧二:
列出表单域中所有元素及其重要属性,就是input,select等的name,value等.

总结:
用这两个技巧可以写一个通用的客户端表单验证函数,至于怎么写,动动脑筋就行了^^.
但是鄙人还是觉得,不能过于依赖客户端的验证机制,现在的人聪明得很,只要花一点小心思,就可以避过客户端的一切限制,鄙人就乐于此道.

目录:
1.当表单提交或重置时向客户端进行确认操作
2.列出表单域中所有元素及其重要属性

shawl.qiu
2006-10-29
http://blog.csdn.net/btbtd

目录:
1.当表单提交或重置时向客户端进行确认操作
    linenum
  1. <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
  2. <scripttype="text/javascript">
  3. //<![CDATA[
  4. functionfCfm(msg){
  5. if(confirm(msg))returntrue;
  6. returnfalse;
  7. }//shawl.qiuscript
  8. //]]>
  9. </script>
  10. <formname="form1"id="form1"method="get"action=""
  11. onsubmit="returnfCfm('现在提交数据吗?');"
  12. onreset="returnfCfm('现在重置表单域所有内容吗?');">
  13.  
  14. <inputname="textfield"type="text"value="tbxdefaultvalue"/>
  15. <br/>
  16. <textareaname="textarea">txadefaultvalue</textarea>
  17. <br/>
  18. <inputtype="submit"name="Submit"value="Submit"/>
  19. <inputtype="reset"name="Reset"value="Reset"/>
  20. </form><br/>
  21. <ahref="?">back</a>

2.列出表单域中所有元素及其重要属性
    linenum
  1. <scripttype="text/javascript">
  2. //<![CDATA[
  3. functionfListFmEle(obj){
  4. try{w.close();}catch(e){}
  5.  
  6. w=open('','popup','width=500,height=500,left=200,top=100,scrollbars')
  7. w.document.write('<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>');
  8.  
  9. for(vari=0;i<obj.length;i++){
  10. w.document.write('objname:',obj[i].name.fontcolor('red'),
  11. '<br/>objtype:',obj[i].type.fontcolor('red'),
  12. '<br/>obj.value:',obj[i].value.fontcolor('blue'),
  13. '<p/>');
  14. }
  15.  
  16. w.document.onclick=function(){w.close();}
  17. w.focus();
  18. }//shawl.qiuscript
  19. //]]>
  20. </script>
  21. <ahref="#"onclick="fListFmEle(document.fm);">listformelements</a><p/>
  22. <formname="fm"id="fm"method="post"action="">
  23. <inputname="textfield"type="text"value="tbxvalue"/><br/>
  24. <inputtype="radio"name="RadioGroup1"value="radio"/>Radio<br/>
  25. <inputtype="radio"name="RadioGroup1"value="radio"/>Radio<br/>
  26. <inputname="cbx"type="checkbox"id="cbx"value="checkbox"/>
  27. <inputname="cbx1"type="checkbox"id="cbx1"value="checkbox"/>
  28. <inputname="cbx2"type="checkbox"id="cbx2"value="checkbox"/><br/>
  29. <selectname="select">
  30. <optionvalue="v">opt</option>
  31. <optionvalue="v1">opt1</option>
  32. </select><br/>
  33. <selectname="sle1"size="2"multipleid="sle1">
  34. <optionvalue="v">sle</option>
  35. <optionvalue="v1">sle1</option>
  36. </select><br/>
  37. <textareaname="textarea">txavalue</textarea><br/>
  38. <inputtype="submit"value="Submit"/>
  39. <inputtype="reset"value="Reset"/>
  40. </form>

本文地址:http://www.45fan.com/a/question/68176.html
Tags: JavaScript 操作 表单
编辑:路饭网
关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部