js 实现在离开页面时提醒未保存的信息(减少用户重复操作)


Posted in Javascript onJanuary 16, 2013

Javascript代码

//在离开页面时判断是否有未保存的输入值 
var hasSaved = false;//是否有输入的内容未保存标志,初始值为false 
function CheckUnsave(){ 
if(hasSaved==false){ 
alert("您上传的东西尚未保存,请保存后再离开页面"); 
return false;} 
//return true; //不能加这个语句 
} //保存了则改变状态 
function ChangeState() 
{ 
hasSaved = true; 
} 
</script>

在body中加入属性onbeforeunload
Html代码
<body onbeforeunload="return CheckUnsave();"><!--一定要加return-->

要在提交action之前调用ChangeState.
如果按下某个按钮后离开页面则不再提醒,比如保存的按钮,则要在保存的按钮按下以后,要修改下是否保存的标志符的状态eg:
Html代码
<input type="submit" name="Submit" value="保 存" onClick="ChangeState();">
Javascript 相关文章推荐
jquery ui resizable bug解决方法
Oct 26 Javascript
学习js在线html(富文本,所见即所得)编辑器
Dec 18 Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 Javascript
详解JS: reduce方法实现 webpack多文件入口
Feb 14 Javascript
jQuery编写textarea输入字数限制代码
Mar 23 jQuery
vue的全局提示框组件实例代码
Feb 26 Javascript
vue首次赋值不触发watch的解决方法
Sep 11 Javascript
如何解决vue2.0下IE浏览器白屏问题
Sep 13 Javascript
java和js实现的洗牌小程序
Sep 30 Javascript
js实现圆形显示鼠标单击位置
Feb 11 Javascript
JavaScript的垃圾回收机制与内存管理
Aug 06 Javascript
js实现弹框效果
Mar 24 Javascript
js拦截alert对话框另类应用
Jan 16 #Javascript
javascript图像处理—仿射变换深度理解
Jan 16 #Javascript
用js获取电脑信息(是使用与IE浏览器)
Jan 15 #Javascript
使用jQuery fancybox插件打造一个实用的数据传输模态弹出窗体
Jan 15 #Javascript
尝试在让script的type属性等于text/html
Jan 15 #Javascript
Js-$.extend扩展方法使方法参数更灵活
Jan 15 #Javascript
js弹出框轻量级插件jquery.boxy使用介绍
Jan 15 #Javascript
You might like
php绝对路径与相对路径之间关系的的分析
2010/03/03 PHP
php 记录进行累加并显示总时长为秒的结果
2011/11/04 PHP
thinkPHP5使用Rabc实现权限管理
2019/08/28 PHP
在Windows上安装Node.js模块的方法
2011/09/25 Javascript
Javascript添加监听与删除监听用法详解
2014/12/19 Javascript
DOM操作一些常用的属性汇总
2015/03/13 Javascript
javascript实现鼠标移到Image上方时显示文字效果的方法
2015/08/07 Javascript
JavaScript基础知识及常用方法总结
2016/01/10 Javascript
如何高效率去掉js数组中的重复项
2016/04/12 Javascript
基于原生JS实现图片裁剪
2016/08/01 Javascript
JavaScript 深层克隆对象详解及实例
2016/11/03 Javascript
jquery与ajax获取特殊字符实例详解
2017/01/08 Javascript
js实现一个简单的MVVM框架示例
2018/01/15 Javascript
详解使用jQuery.i18n.properties实现js国际化
2018/05/04 jQuery
微信小程序canvas实现刮刮乐效果
2018/07/09 Javascript
详解Vue实战指南之依赖注入(provide/inject)
2018/11/13 Javascript
微信小程序—setTimeOut定时器的问题及解决
2019/07/26 Javascript
Vue3配置axios跨域实现过程解析
2020/11/25 Vue.js
python读取csv文件示例(python操作csv)
2014/03/11 Python
从零学python系列之数据处理编程实例(二)
2014/05/22 Python
python正则表达式re模块详细介绍
2014/05/29 Python
基于Linux系统中python matplotlib画图的中文显示问题的解决方法
2017/06/15 Python
通过字符串导入 Python 模块的方法详解
2019/10/27 Python
python线程join方法原理解析
2020/02/11 Python
带你学习Python如何实现回归树模型
2020/07/16 Python
Python使用xpath实现图片爬取
2020/09/16 Python
Python中免验证跳转到内容页的实例代码
2020/10/23 Python
基于Python-turtle库绘制路飞的草帽骷髅旗、美国队长的盾牌、高达的源码
2021/02/18 Python
澳洲国民品牌乡村路折扣店:Country Road & Trenery Outlet
2018/04/19 全球购物
德国自行车商店:Tretwerk
2019/06/21 全球购物
char型变量中能不能存贮一个中文汉字
2015/07/08 面试题
Linux面试经常问的文件系统操作命令
2016/10/04 面试题
无财产无子女离婚协议书范文
2014/09/14 职场文书
党员民主生活会整改措施
2014/09/26 职场文书
Python 解决空列表.append() 输出为None的问题
2021/05/23 Python
如何在Mac上通过docker配置PHP开发环境
2021/05/29 PHP