js获取form的方法


Posted in Javascript onMay 06, 2015

本文实例讲述了js获取form的方法。分享给大家供大家参考。具体如下:

先来看下面代码:

<html> 
<head> 
<scirpy> 
window.onload=function(){ 
   var f1=document.f1; 
   var f2=document.forms[1]; 
 alert(f2.id); 
  var f3=document.forms['f1']; 
} 
</script> 
</head> 
<body> 
<form id="f1" value="f1"></from> 
<from id="f2" value="f2"></form> 
</body> 
</html>

操作表单:

<html> 
 <head> 
 <script> 
  function checkform(f){ 
  var uname=f.username; 
  var pwd=f.password; 
  if(uname.value.length<4){ 
  alert('用户长度必须大于4'); 
  return false; 
  } 
  if(pwd.value.length!=6){ 
  alert('用户密码必须大于 6位'); 
  return false; 
  } 
  return true; 
  } 
 </script> 
 </head> 
 <body> 
 <form id="f1" name="f1" method="post" action=""
 onsubmit="return checkform(this)"> 
   <input name="username" value="" /></br> 
  <input name="password" value="" /></br> 
  <input type="button" value="提交" />  
 </form> 
 </body> 
</html>

js操作form的三种方式:

1. 利用表单在文档中的索引或表单的name属性来引用表单

document.forms[i]  //得到页面中的第i个表单

document.forms[fromName] //得到页面中相应name的表单

2. 利用表单的id属性

document.getElementById(formId);

3.

document.formName;//最为常用的一种方式

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 页面坐标相关知识整理
Jan 09 Javascript
javascript面向对象之Javascript 继承
May 04 Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 Javascript
javascript简单实现表格行间隔显示颜色并高亮显示
Nov 29 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
Feb 18 Javascript
整理JavaScript对DOM中各种类型的元素的常用操作
May 05 Javascript
JavaScript制作简单分页插件
Sep 11 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
May 22 Javascript
详解javascript对数组和json数组的操作
Apr 15 Javascript
vscode中eslint插件的配置(prettier配置无效)
Sep 10 Javascript
jQuery实现的图片点击放大缩小功能案例
Jan 02 jQuery
jQuery编写QQ简易聊天框
Aug 27 jQuery
js给selected添加options的方法
May 06 #Javascript
js表格排序实例分析(支持int,float,date,string四种数据类型)
May 06 #Javascript
js实现漂浮回顶部按钮实例
May 06 #Javascript
js实现仿百度汽车频道选择汽车图片展示实例
May 06 #Javascript
js中日期的加减法
May 06 #Javascript
javascript实现回到顶部特效
May 06 #Javascript
javascript实现完美拖拽效果
May 06 #Javascript
You might like
php判断变量类型常用方法
2012/04/24 PHP
PHP调用wsdl文件类型的接口代码分享
2014/11/19 PHP
浅谈PHP中单引号和双引号到底有啥区别呢?
2015/03/04 PHP
PHP实现连接设备、通讯和发送命令的方法
2015/10/13 PHP
php版微信公众平台实现预约提交后发送email的方法
2016/09/26 PHP
thinkphp5.1框架中容器(Container)和门面(Facade)的实现方法分析
2019/08/05 PHP
图像替换新技术 状态域方法
2010/01/28 Javascript
浅说js变量
2011/05/25 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
2016/09/17 Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
2016/10/01 Javascript
JS实现随机颜色的3种方法与颜色格式的转化
2017/01/05 Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
2017/01/24 Javascript
js css自定义分页效果
2017/02/24 Javascript
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
2017/07/08 jQuery
jQuery 循环遍历改变a标签的href(实例讲解)
2017/07/12 jQuery
JS实现图片居中悬浮效果
2017/12/25 Javascript
AngularJS实现的简单拖拽功能示例
2018/01/02 Javascript
webpack4的迁移的使用方法
2018/05/25 Javascript
JavaScript循环遍历你会用哪些之小结篇
2018/09/28 Javascript
解决微信小程序调用moveToLocation失效问题【超简单】
2019/04/12 Javascript
JavaScript十大取整方法实例教程
2020/12/03 Javascript
浅谈Python中列表生成式和生成器的区别
2015/08/03 Python
windows下python 3.6.4安装配置图文教程
2018/08/21 Python
详解python3 GUI刷屏器(附源码)
2021/02/18 Python
IE兼容css3圆角的实现代码
2011/07/21 HTML / CSS
5 个强大的HTML5 API 函数推荐
2014/11/19 HTML / CSS
HTML5+CSS设置浮动却没有动反而在中间且错行的问题
2020/05/26 HTML / CSS
Bandier官网:奢侈、时尚前卫的健身服装首选目的地
2020/07/05 全球购物
一个C/C++编程面试题
2013/11/10 面试题
金融专业个人的自我评价
2013/10/18 职场文书
货代行业个人求职简历的自我评价
2013/10/22 职场文书
新闻编辑自荐书范文
2014/02/12 职场文书
残疾人小组计划书
2014/04/27 职场文书
教师个人查摆剖析材料
2014/10/14 职场文书
小学生差生评语
2014/12/29 职场文书
反腐倡廉观后感
2015/06/08 职场文书