javascript检查表单数据是否改变的方法


Posted in Javascript onJuly 30, 2013

有的时候,需要检查用户是否修改了一个表单中的内容,则可以使用下面的技巧,其中如果修改了表单的内容则返回true,没修改表单的内容则返回false。代码如下:

function formIsDirty(form) { 
for (var i = 0; i < form.elements.length; i++) { 
var element = form.elements[i]; 
var type = element.type; 
if (type == "checkbox" || type == "radio") { 
if (element.checked != element.defaultChecked) { 
return true; 
} 
} 
else if (type == "hidden" || type == "password" || type == "text" || type == "textarea") { 
if (element.value != element.defaultValue) { 
return true; 
} 
} 
else if (type == "select-one" || type == "select-multiple") { 
for (var j = 0; j < element.options.length; j++) { 
if (element.options[j].selected != element.options[j].defaultSelected) { 
return true; 
} 
} 
} 
} 
return false; 
} 
window.onbeforeunload = function(e) { 
e = e || window.event; 
if (formIsDirty(document.forms["someForm"])) { 
if (e) { 
e.returnValue = "You have unsaved changes."; 
} 
return "You have unsaved changes."; 
} 
};
Javascript 相关文章推荐
Javascript this关键字使用分析
Oct 21 Javascript
iframe 上下滚动条如何默认在下方实现原理
Dec 10 Javascript
用表格输出1-1000之间的数字实现代码(附特效)
Apr 21 Javascript
JQuery之proxy实现绑定代理方法
Aug 01 Javascript
jquery 禁止鼠标右键并监听右键事件
Apr 27 jQuery
详解vue-cli项目中用json-sever搭建mock服务器
Nov 02 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
JS使用canvas中的measureText方法测量字体宽度示例
Feb 02 Javascript
layui按条件隐藏表格列的实例
Sep 19 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 Javascript
JS数据类型(基本数据类型、引用数据类型)及堆和栈的区别分析
Mar 04 Javascript
vue+element_ui上传文件,并传递额外参数操作
Dec 05 Vue.js
JS 对输入框进行限制(常用的都有)
Jul 30 #Javascript
JS无限极树形菜单,json格式、数组格式通用示例
Jul 30 #Javascript
js中widow.open()方法使用详解
Jul 30 #Javascript
Extjs NumberField后面加单位实现思路
Jul 30 #Javascript
Js中获取frames中的元素示例代码
Jul 30 #Javascript
js中的屏蔽的使用示例
Jul 30 #Javascript
使用js正则控制input标签只允许输入的值
Jul 29 #Javascript
You might like
PHP5.3安装Zend Guard Loader图文教程
2014/09/29 PHP
Smarty中调用FCKeditor的方法
2014/10/27 PHP
Yii框架ACF(accessController)简单权限控制操作示例
2019/04/26 PHP
Yii框架连表查询操作示例
2019/09/06 PHP
非常不错的功能强大代码简单的管理菜单美化版
2008/07/09 Javascript
jquery实现带单选按钮的表格行选中时高亮显示
2013/08/01 Javascript
input禁止键盘及中文输入,但可以点击
2014/02/13 Javascript
js浏览器本地存储store.js介绍及应用
2014/05/13 Javascript
jquery如何获取元素的滚动条高度等实现代码
2015/10/19 Javascript
基于JS实现导航条之调用网页助手小精灵的方法
2016/06/17 Javascript
浅谈JS中json数据的处理
2016/06/30 Javascript
javascript简单进制转换实现方法
2016/11/24 Javascript
jquery对所有input type=text的控件赋值实现方法
2016/12/02 Javascript
Agularjs妙用双向数据绑定实现手风琴效果
2017/05/26 Javascript
详解AngularJS ng-class样式切换
2017/06/27 Javascript
利用Javascript获取选择文本所在的句子详解
2017/12/03 Javascript
vue.js 图片上传并预览及图片更换功能的实现代码
2018/08/27 Javascript
详解koa2学习中使用 async 、await、promise解决异步的问题
2018/11/13 Javascript
vue 更改连接后台的api示例
2019/11/11 Javascript
JavaScript实现拖拽效果
2020/03/16 Javascript
[36:54]Mineski vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python程序员面试题 你必须提前准备!
2018/01/16 Python
python 获取毫秒数,计算调用时长的方法
2019/02/20 Python
python3利用Socket实现通信的方法示例
2019/05/06 Python
python+Django实现防止SQL注入的办法
2019/10/31 Python
TensorFlow实现指数衰减学习率的方法
2020/02/05 Python
PyCharm+Pipenv虚拟环境开发和依赖管理的教程详解
2020/04/16 Python
C语言变量的命名规则都有哪些
2013/12/27 面试题
公司财务总监岗位职责
2013/12/14 职场文书
县优秀教师事迹材料
2014/01/31 职场文书
2014道德模范事迹材料
2014/02/16 职场文书
会计专业个人自我鉴定
2014/03/21 职场文书
淘宝好评语大全
2014/05/05 职场文书
财务部会计岗位职责
2015/02/03 职场文书
全陪导游词开场白
2015/05/29 职场文书
承兑汇票延期证明
2015/06/23 职场文书