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


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 相关文章推荐
jQuery图片滚动图片的效果(另类实现)
Jun 02 Javascript
JavaScript实现的简单幂函数实例
Apr 17 Javascript
javascript判断变量是否有值的方法
Apr 20 Javascript
JavaScript检测字符串中是否含有html标签实现方法
Jul 01 Javascript
基于jquery插件实现拖拽删除图片功能
Aug 27 Javascript
bootstrap table实现合并单元格效果
Dec 24 Javascript
Vue核心概念Action的总结
Jan 18 Javascript
js打开word文档预览操作示例【不是下载】
May 23 Javascript
9种方法优化jQuery代码详解
Feb 04 jQuery
JavaScript异步操作的几种常见处理方法实例总结
May 11 Javascript
原生JS生成指定位数的验证码
Oct 28 Javascript
cypress测试本地web应用
Jun 01 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作的文本留言本的例子(五)
2006/10/09 PHP
PHP 柱状图实现代码
2009/12/04 PHP
PHPThumb图片处理实例
2014/05/03 PHP
解决php表单重复提交实现方法
2015/09/29 PHP
基于jquery的弹出提示框始终处于窗口的居中位置(类似于alert弹出框的效果)
2011/09/28 Javascript
js算法中的排序、数组去重详细概述
2013/10/14 Javascript
引入JS文件IE6报语法错误或缺少对象问题的解决方法
2014/01/09 Javascript
javascript的解析执行顺序在各个浏览器中的不同
2014/03/17 Javascript
javascript中声明函数的方法及调用函数的返回值
2014/07/22 Javascript
Javascript非构造函数的继承
2015/04/27 Javascript
JavaScript中rem布局在react中的应用
2015/12/09 Javascript
Bootstrap富文本组件wysiwyg数据保存到mysql的方法
2016/05/09 Javascript
jQuery如何封装输入框插件
2016/08/19 Javascript
微信小程序 实例开发总结
2017/04/26 Javascript
Vue.js实现的购物车功能详解
2019/01/27 Javascript
ES6基础之默认参数值
2019/02/21 Javascript
koa2 从入门到精通(小结)
2019/07/23 Javascript
Vue自定义多选组件使用详解
2020/09/08 Javascript
JavaScript实现手风琴效果
2021/02/18 Javascript
[01:13]2014DOTA2西雅图邀请赛 舌尖上的TI4
2014/07/08 DOTA
[06:24]DOTA2 2015国际邀请赛中国区预选赛第二日TOP10
2015/05/27 DOTA
Python实现八大排序算法
2016/08/13 Python
NetworkX之Prim算法(实例讲解)
2017/12/22 Python
Python中的取模运算方法
2018/11/10 Python
判断Threading.start新线程是否执行完毕的实例
2020/05/02 Python
Python Pandas 对列/行进行选择,增加,删除操作
2020/05/17 Python
工商学院毕业生自荐信
2013/11/12 职场文书
简历中自我评价范文3则
2013/12/14 职场文书
运动会邀请函范文
2014/02/06 职场文书
岗位聘任书范文
2014/03/29 职场文书
物理学专业自荐信
2014/06/11 职场文书
原告代理词范文
2015/05/25 职场文书
go:垃圾回收GC触发条件详解
2021/04/24 Golang
python中os.path.join()函数实例用法
2021/05/26 Python
Oracle查看表空间使用率以及爆满解决方案详解
2022/07/23 Oracle