表单--form对象
来源:互联网 发布:micro800编程软件下载 编辑:程序博客网 时间:2024/04/28 17:37
在Javascript 中,页面上的每一对<form> 标记都解析为一个对象,即form 对象。所有的表单元素都支持type、name、form、value属性。
如果一个表单对象定义如下:
<form name="frm1" method="post" action="login.aspx">
获得该表单对象的方法:
1> document.forms["frm1"]; // 根据name属性值
2> document.forms[0]; // 根据索引号
3> document.frm1; // 直接根据name值获得对象
每一个表单元素的文字描述都应该使用<label>标签。
该标签用于将文字绑定到对应的表单元素上,它的for 属性指定它所要绑定的表单元素id 值。绑定后单击该文字,鼠标将聚焦到对应的文本框中或选中对应的选项。
示例代码如下:
<form method="post" name="frm1"> <label for="txt">点我将聚焦到文本框</label> <input type="text" id="txt" name="myname"><br/> <label for="rdo">点我将选中单选框</label> <input type="radio" id="rdo" name="male"/><br/> <label for="cbo">点我将选中复选框</label> <input type="checkbox" id="cbo" name="hobby"></form>效果图如下:
注意:
i > 每个表单元素应当尽量使用<label>标签来提高用户体验;
ii > 每个表单元素应当分配 name属性 和 id 属性。
name 属性:用来将数据提交到服务器;
id 属性:用来在客户端做相应的操作;如:<label>标签的绑定、CSS 选择器的使用等。
submit()方法可以使用JS调用这个方法将表单提交。如果使用submit( ) 方法来提交表单,则不会触发<form> 表单元素的onsubmit 事件,这是与用<input type="submit">提交元素不同的地方。
注意:
不要将表单中项name命名为submit。
如:
html结构:
<form name="frm" action="reg.php" method="post" onsubmit="return yan()">username:<input type="text" name="username" value=""><br>password:<input type="text" name="password" value=""><br><input type="submit" name="dosubmit" value="登录"><br></form>js:
<script type="text/javascript">function yan(){var username = document.frm.username;var password = document.frm.password;if(username.value==""){alert("用户名不能为空");return false;}if(password.value==""){alert("密码不能为空");return false;}return true;}</script>
- 14 Form表单对象
- JavaScript表单对象Form
- form表单的对象
- 表单--form对象
- JavaScript表单对象Form介绍
- form表单的input对象
- JavaScript表单对象Form介绍
- form 表单格式化成 对象
- JavaScript表单对象Form介绍
- Form对象,表单的笔记
- form表单中常用对象
- form表单的input对象
- form表单序列化与对象装填form表单
- jquery form表单序列化为对象
- form表单转换为json对象
- 将form表单转化为jzvascript对象
- SpringMVC - 页面form表单绑定对象
- 重置form表单为json对象
- Poj_3278 Catch That Cow(BFS)
- xml中id带+与不带+的区别
- 【数据库开发】MySQL修改root密码
- Laravel之请求(转载)
- svn: OPTIONS request failed on
- 表单--form对象
- Git学习笔记
- 面试题:只能在UI线程里面更新界面吗?
- Android简易实战教程--第四十九话《满屏拖动的控件》
- CodeForces - 749C Voting 队列模拟
- ajax和jquery
- 多线程---停止线程
- 数值分析实验 Python
- bzoj 4568: [Scoi2016]幸运数字 倍增维护线性基