表单的一些基本用法与技巧


Posted in Javascript onJuly 15, 2006

1、 用图像代替提交按钮
 当只有一个提交按钮的时候,可以简单地实现,不用加事件函数,代码是:
 <input type="image" name="..." src="url" width="" height="..." border="...">
 除了标签改为input type="image"以外,其它的属性和<img>标签的属性是一样的。

 2、用图片代替所有的表单按钮:
 代替submit按钮的图片代码格式是
 <input type="image" name="..." src="..." onClick="document.formName.submit()">
 代替reset按钮的代码图片格式是
 <input type="image" name="..." src="..." onClick="document.formName.reset()">
 注:这里的formName是表单的name属性值。

 3、表单的提交验证:
 <script>
 function CheckDate(){
 //取得输入的数据
 userName = document.RedForm.userName.value;
 userEmail = document.RedForm.userEmail.value;
 //如果没有输入姓名
 if (userName=="") {
 alert("请输入姓名");
 document.RedForm.userName.focus();
 return false;
 }else{
 //如果没有输入Email,或者Email地址错误(不含@)
 if ((userEmail=="")||(userEmail.indexOf("@")==-1)) {alert("请重新输入Email地址");
 document.RedForm.userEmail.focus();
 return false;
 }else return true;
 }
 }
 </script>

 4、用任何元素提交表单:
 通过onClick="document.form.submit();"来提交表单;用onClick="document.form.reset();"来复位表单,这样一来,任何一个元素都可以实现提交表单了。

Javascript 相关文章推荐
JavaScript call apply使用 JavaScript对象的方法绑定到DOM事件后this指向问题
Sep 28 Javascript
js动态修改input输入框的type属性(实现方法解析)
Nov 13 Javascript
Javascript调用函数方法的几种方式介绍
Mar 20 Javascript
浅谈JavaScript正则表达式分组匹配
Apr 10 Javascript
javascript构造函数以及原型对象的理解
Jan 13 Javascript
从零学习node.js之详解异步控制工具async(八)
Feb 27 Javascript
bootstrap日期控件问题(双日期、清空等问题解决)
Apr 19 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
Apr 20 Javascript
angular中实现li或者某个元素点击变色的两种方法
Jul 27 Javascript
AngularJS select设置默认值的实现方法
Aug 25 Javascript
基于angular-utils-ui-breadcrumbs使用心得(分享)
Nov 03 Javascript
微信小程序一周时间表功能实现
Oct 17 Javascript
popdiv
Jul 14 #Javascript
游戏人文件夹程序 ver 4.03
Jul 14 #Javascript
游戏人文件夹程序 ver 3.0
Jul 14 #Javascript
表单提交验证类
Jul 14 #Javascript
如何实现浏览器上的右键菜单
Jul 10 #Javascript
载入进度条 效果
Jul 08 #Javascript
让广告代码不再影响你的网页加载速度
Jul 07 #Javascript
You might like
php实现微信公众平台账号自定义菜单类
2015/10/11 PHP
PHP面试题之文件目录操作
2015/10/15 PHP
javascript call和apply方法
2008/11/24 Javascript
js中将HTMLCollection/NodeList/伪数组转换成数组的代码
2011/07/31 Javascript
编写针对IE的JS代码两种编写方法
2013/01/30 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
2016/04/01 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
2016/10/10 Javascript
angular 内存溢出的问题解决
2018/07/12 Javascript
解决select2在bootstrap modal中不能正常使用的问题
2018/08/09 Javascript
vue-video-player 通过自定义按钮组件实现全屏切换效果【推荐】
2018/08/29 Javascript
element UI upload组件上传附件格式限制方法
2018/09/04 Javascript
vue实现计步器功能
2019/11/01 Javascript
原生JavaScript实现刮刮乐
2020/09/29 Javascript
vue实现图片裁剪后上传
2020/12/16 Vue.js
Python单例模式实例详解
2017/03/01 Python
Python实现登录接口的示例代码
2017/07/21 Python
python画折线图的程序
2018/07/26 Python
Python3 实现文件批量重命名示例代码
2019/06/03 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
python用requests实现http请求代码实例
2019/10/31 Python
在pytorch中动态调整优化器的学习率方式
2020/06/24 Python
python实现画图工具
2020/08/27 Python
python3实现简单飞机大战
2020/11/29 Python
Html5页面获取微信公众号的openid的方法
2020/05/12 HTML / CSS
美国亚马逊旗下男装网站:East Dane(支持中文)
2019/09/25 全球购物
人事行政主管岗位职责
2013/12/22 职场文书
运动会开幕式邀请函
2014/01/22 职场文书
优秀班集体获奖感言
2014/02/03 职场文书
项目经理聘任书
2014/03/29 职场文书
社区反邪教工作方案
2014/06/16 职场文书
试用期自我评价怎么写
2015/03/10 职场文书
安全伴我行主题班会
2015/08/13 职场文书
《女娲补天》读后感5篇
2019/12/31 职场文书
redis sentinel监控高可用集群实现的配置步骤
2022/04/01 Redis
html网页引入svg图片的4种方式
2022/08/05 HTML / CSS