onfocus 和 onblur 事件,监听离开页面和进入页面
<script>
var normalTitle = document.title
window.onfocus = function () {
document.title = '(/≧▽≦/)咦!你又回来啦';
setTimeout(function(){
document.title = normalTitle;
}, 1500);
};
window.onblur = function () {
document.title = '等等,你别走啊!!';
};
</script>
使用 visibilitychange 事件
这种方法好像更实用些,当页面标签隐藏或显示就会触发该事件
<script>
document.addEventListener('visibilitychange',function(){
if( document.visibilityState == 'hidden' ){
normal_title = document.title;
document.title = '哎哟,你别走嘛';
}else{
document.title = '(/≧▽≦/)咦!你又回来啦';
setTimeout(function(){
document.title = normal_title;
}, 1200)
}
});
</script>
或者
<script type="text/javascript">
var OriginTitile=document.title;
var titleTime;
document.addEventListener('visibilitychange',
function(){
if(document.hidden){
document.title='哎哟,你别走嘛';
clearTimeout(titleTime)
}else{
document.title='(/≧▽≦/)咦!你又回来啦!';
titleTime=setTimeout(function(){document.title=OriginTitile},1200)
}
},!1);
</script>