七空幻音LOGO

七空幻音

离开页面确认表单元素是否被改变2016-03-06 14:13:57

用过wordpress的都知道写文章的是如果离开了页面没有保存的话,那么表单里面的内容就会被清空,打个比方:比如我在写一片文章什么的突然不小心按到了backspace键返回到了上一级页面,那么我这个文章就没保存,写了很多没有保存想想都知道是什么心情,记得上一次,写一篇文章没有保存,写了一大篇了,瞬间就没了。真气人。

js提供了很多事件函数我们就可以找到离开页面触发的函数来让用户确认是否离开

<form>
    <textarea cols="30" rows="10" oninput="change()"></textarea>
</form>
<a href="">退出</a>
<script>
    var flag = false;//定义是否被改变
    function change(){
        flag = true;//输入后就改变成true
    }
    window.onbeforeunload = function(e) {//离开页面触发
        if(flag){//判断是否被改变
            return true;//弹出对话框提醒用户
         }
    }
</script>

然后输入了内容再点击退出就会出现 本页面要求您确认您要离开 - 您输入的数据可能不会被保存

0条评论登录后可见

用户头像
幻音い
咕了咕了咕了....

文章:125

收藏:3

查看更多
详细图片
载入中...