当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 表单的一些基本用法与技巧

Javascript
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码
浮动广告js类实现
使用透明叠加法美化文件上传界面的代码
用Div仿showModalDialog模式菜单的效果的代码
JsEasy简介 JsEasy是什么?与下载
网页屏蔽(左右键,代码等)的非JS方法
在IE模态窗口中自由查看HTML源码的方法
点下网页的任意地方,都可到达指定页面的js代码
实例学习Javascript之构建方法、属性
腾讯QQ网页在线客服,隐藏在网页一侧的隐现效果二
腾讯QQ网页在线客服,随网页滚动条上下移动的效果一
可以媲美Flash的JS导航菜单
js实现的XP风格的右键菜单
用JavaScript实现仿Windows关机效果
学习YUI.Ext基础第一天
学习YUI.Ext 第四天--对话框Dialog的使用
Gird组件 Part-3:范例RSSFeed Viewer
可缩放Reloaded-一个针对可缩放元素的复用组件
简单三步,搞掂内存泄漏
pjblog修改技巧汇总

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 190 ::
收藏到网摘: n/a

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();"来复位表单,这样一来,任何一个元素都可以实现提交表单了。