js检测离开或刷新页面时表单数据是否更改的方法


Posted in Javascript onAugust 02, 2016

本文实例讲述了js检测离开或刷新页面时表单数据是否更改的方法。分享给大家供大家参考,具体如下:

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"])) {
    // IE 和 Firefox
    if (e) {
      e.returnValue = "对不起,页面数据已做修改,尚未保存,确定要刷新或离开本页面?";
    }
    // Safari浏览器
    return "对不起,页面数据已做修改,尚未保存,确定要刷新或离开本页面?";
  }
};

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
让innerHTML的脚本也可以运行起来
Jul 01 Javascript
Extjs 3.3切换tab隐藏相应工具栏出现空白解决
Apr 02 Javascript
window.navigate 与 window.location.href 的使用区别介绍
Sep 21 Javascript
jQuery构造函数init参数分析续
May 13 Javascript
jQuery实现不断闪烁文字的方法
May 15 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
Jun 17 Javascript
JS实现图片局部放大或缩小的方法
Aug 20 Javascript
js将字符串中的每一个单词的首字母变为大写其余均为小写
Jan 05 Javascript
详解使用nvm安装node.js
Jul 18 Javascript
JavaScript之解构赋值的理解
Jan 30 Javascript
详解vue 在移动端体验上的优化解决方案
May 20 Javascript
js常见遍历操作小结
Jun 06 Javascript
AngularJS基础 ng-options 指令详解
Aug 02 #Javascript
深入理解JavaScript中Ajax
Aug 02 #Javascript
AngularJS基础 ng-open 指令简单实例
Aug 02 #Javascript
AngularJS基础 ng-non-bindable 指令详细介绍
Aug 02 #Javascript
实例详解jQuery的无new构建
Aug 02 #Javascript
AngularJS基础 ng-mouseover 指令简单示例
Aug 02 #Javascript
JavaScript比较当前时间是否在指定时间段内的方法
Aug 02 #Javascript
You might like
使用PHP数组实现无限分类,不使用数据库,不使用递归.
2006/12/09 PHP
发款php蜘蛛统计插件只要有mysql就可用
2010/10/12 PHP
php模板原理讲解
2013/11/13 PHP
PHP中exec函数和shell_exec函数的区别
2014/08/20 PHP
PHP添加PNG图片背景透明水印操作类定义与用法示例
2019/03/12 PHP
ThinkPHP 5 AJAX跨域请求头设置实现过程解析
2020/10/28 PHP
JavaScript 事件属性绑定带参数的函数
2009/03/13 Javascript
js判断横竖屏及禁止浏览器滑动条示例
2014/04/29 Javascript
javaScript年份下拉列表框内容为当前年份及前后50年
2014/05/28 Javascript
jQuery中复合属性选择器用法实例
2014/12/31 Javascript
简介JavaScript中search()方法的使用
2015/06/06 Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
2016/05/27 Javascript
Bootstrap基本模板的使用和理解1
2016/12/14 Javascript
bootstrap表格分页实例讲解
2016/12/30 Javascript
JS区分Object与Aarry的六种方法总结
2017/02/27 Javascript
Angular表格神器ui-grid应用详解
2017/09/29 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
JavaScript中Object、map、weakmap的区别分析
2020/12/15 Javascript
[00:34]DOTA2上海特级锦标赛 Spirit战队宣传片
2016/03/04 DOTA
Python合并字典键值并去除重复元素的实例
2016/12/18 Python
Python cookbook(数据结构与算法)从任意长度的可迭代对象中分解元素操作示例
2018/02/13 Python
详解重置Django migration的常见方式
2019/02/15 Python
python爬虫租房信息在地图上显示的方法
2019/05/13 Python
python文本数据处理学习笔记详解
2019/06/17 Python
django的auth认证,authenticate和装饰器功能详解
2019/07/25 Python
500行代码使用python写个微信小游戏飞机大战游戏
2019/10/16 Python
tf.concat中axis的含义与使用详解
2020/02/07 Python
四个太阳教学反思
2014/02/01 职场文书
学校火灾防控方案
2014/06/09 职场文书
学校读书活动总结
2014/06/30 职场文书
联谊活动总结范文
2015/05/09 职场文书
教师调动申请报告
2015/05/18 职场文书
教研活动主持词
2015/07/03 职场文书
2016年社区综治宣传月活动总结
2016/03/16 职场文书
祝福语集锦:给百岁老人祝寿贺词
2019/11/19 职场文书
MySQL 那些常见的错误设计规范,你都知道吗
2021/07/16 MySQL