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 相关文章推荐
用正则xmlHttp实现的偷(转)
Jan 22 Javascript
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
Dec 27 Javascript
基于datagrid框架的查询
Apr 08 Javascript
Extjs 继承Ext.data.Store不起作用原因分析及解决
Apr 15 Javascript
js获取select默认选中的Option并不是当前选中值
May 07 Javascript
jQuery响应滚动条事件功能示例
Oct 14 jQuery
jquery中done和then的区别(详解)
Dec 19 jQuery
小程序封装路由文件和路由方法(5种全解析)
May 26 Javascript
微信小程序如何获取用户头像和昵称
Sep 23 Javascript
使用layer弹窗提交表单时判断表单是否输入为空的例子
Sep 26 Javascript
vue自动化路由的实现代码
Sep 30 Javascript
javascript 使用sleep函数的常见方法详解
Apr 26 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
自己动手,丰衣足食 - 短波框形天线制作
2021/03/01 无线电
新浪SAE搭建PHP项目教程
2015/01/28 PHP
Laravel5.7 数据库操作迁移的实现方法
2019/04/12 PHP
jquery 元素相对定位代码
2010/10/15 Javascript
jquery ajax 调用失败的原因示例介绍
2013/09/27 Javascript
利用jquery写的左右轮播图特效
2014/02/12 Javascript
Jquery 实现table样式的设定
2015/01/28 Javascript
JS通过Cookie判断页面是否为首次打开
2016/02/05 Javascript
Node.js编写爬虫的基本思路及抓取百度图片的实例分享
2016/03/12 Javascript
jQuery Easyui datagrid连续发送两次请求问题
2016/12/13 Javascript
JS调用Android、Ios原生控件
2017/01/06 Javascript
JavaScript实现水平进度条拖拽效果
2017/01/18 Javascript
JavaScript简单实现合并两个Json对象的方法示例
2017/10/16 Javascript
利用nodeJs anywhere搭建本地服务器环境的方法
2018/05/12 NodeJs
Node.js之删除文件夹(含递归删除)代码实例
2019/09/09 Javascript
使用layui定义一个模块并使用的例子
2019/09/14 Javascript
layui table复选框禁止某几条勾选的实例
2019/09/20 Javascript
[01:07:11]Secret vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
python正则表达式match和search用法实例
2015/03/26 Python
使用PyQtGraph绘制精美的股票行情K线图的示例代码
2019/03/14 Python
python的内存管理和垃圾回收机制详解
2019/05/18 Python
python 读写excel文件操作示例【附源码下载】
2019/06/19 Python
pyinstaller打包多个py文件和去除cmd黑框的方法
2019/06/21 Python
详解Python3迁移接口变化采坑记
2019/10/11 Python
Keras 在fit_generator训练方式中加入图像random_crop操作
2020/07/03 Python
基于 HTML5 Canvas实现 的交互式地铁线路图
2018/03/05 HTML / CSS
HTML5中的网络存储实现方式
2020/04/28 HTML / CSS
英国领先的运动营养品牌:Protein Dynamix
2018/01/02 全球购物
软件设计的目标是什么
2016/12/04 面试题
企业总经理岗位职责
2014/02/13 职场文书
动漫专业高职生职业生涯规划书
2014/02/15 职场文书
防灾减灾活动总结
2014/08/30 职场文书
师德承诺书2015
2015/04/28 职场文书
欠款证明
2015/06/24 职场文书
Vue中foreach数组与js中遍历数组的写法说明
2021/06/05 Vue.js
Mysql中@和@@符号的详细使用指南
2022/06/05 MySQL