关闭浏览器或者关闭使用window.open打开的页面时添加监听事件
最近工作中有个需求:点击按钮时打开一个页面,此处取名为page1,打开页面的前提条件是如果有人已经打开过page1页面并且没有关闭时请求ajax判断session是否为空,如果为空则将用户名和文档id存入session,如果不为空则提示已有人打开此页面。
$(function(){
addassbutton('_FORM_PF_sp_f22860');
function addassbutton(textid){
$('#'+textid).after("<br/><input type='button' id='visualButton' value='' style='background:url(/fileftp/2013/05/2013-05-13/U32P4T47D26207F980DT20130513164525.gif) no-repeat; border:0px;width:108px;height:28px;padding-bottom:16px;margin-left:5px;'/>");
}
$("#visualButton").bind('click',function(){
var ztselected = $("select[name=_FORM_PF_sp_f22820] option:selected").val();
if(ztselected==''){
alert("请先选择专题名称");
return;
}else{
if(did_gspsass !==''){
$.ajax({
//async:false,
url: '/api/checkSess/' + username_gspsass + '/' + did_gspsass,
type: 'get',
dataType: 'json',
success:function(res){
console.log(res);
console.log(res.username === username_gspsass);
if(res.session==='true'){
openWin();
}else{
//alert("不允许多人同时操作,紧急情况请联系<strong>" + res.username + "</strong>");
alert("不允许多人同时操作");
}
}
})
}else{
openWin();
}
}
});
});
function openWin(){
window.open('/gsps/visualization/visual.html','newwindow','height=800,width=1500,top=0,left=0,toolbar=no,menubar=no,scrollbars=yes, resizable=yes,location=no, status=no');
}

点击"可视化编辑"按钮时先请求ajax时会出现window.open弹窗被chrome拦截的问题(参考1链接),原因:由于window.open的执行时机,window.open在ajax中执行,无论是同步还是异步,等待ajax返回结果都需要一定的时间,当得到返回的结果然后再执行window.open时,chrome认为是不友好的行为,非用户主动点击打开弹窗),所以会被屏蔽。
解决方法一:允许被阻止的页面打开,
解决方法二:先打开一个空白页,然后等ajax回来的结果,拿到链接地址,替换掉之前空白页的url(参考2链接)。
注意: 使用解决方法一时,用户第一次打开页面newwindow(不关闭),当用户再次点击按钮触发时没有反应,因为newwindow已经打开,但是需要用户手动去找打开的newwindow,不能自动弹出已经打开的页面,容易让用户以为程序出现了问题,不利于用户体验,如若有解决方法,请在评论区留言,多谢!!!
使用解决方法二时,用户第一次打开页面newwindow(不关闭),当用户再次点击按钮触发时会弹出一个空白页覆盖newwindow,暂未找到解决方法,如若有解决方法,请在评论区留言,多谢!!!
不调用ajax时,代码如下:

点击按钮时会打开visual.html页面(名称为page1),并且再次点击按钮时打开的还是page1页面,会自动弹出;
参考:1、http://blog.csdn.net/xufaxi/article/details/6647952
2、https://segmentfault.com/q/1010000006760018/a-1020000006765547
3、http://www.cnblogs.com/catalina-/p/5846353.html
关闭浏览器或者关闭使用window.open打开的页面时添加监听事件的更多相关文章
- 用window.showModalDialog()打开的页面Request.UrlReferrer为null
今天在解决一个问题,怎么也找不到解决方案.我的一个窗体是IE通过window.showModalDialog()打开的,但为了防止用户手工输的地址,所以我需要判断是通过别的页面调整获得,用Reques ...
- window.onresize监听事件
window.onresize监听事件 onresize 事件会在窗口或框架被调整大小时发生. 支持onresize的标签:<a>, <address>, <b>, ...
- vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式
// 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...
- 让$(window).scroll()监听事件只执行一次
可以用jQuery中的unbind()来进行事件解绑. $(window).scroll(function() { console.log("滚离顶部" + $(document) ...
- 打开jsp页面时,显示空白页。
打开jsp页面时,显示空白页. #foreach($e in $listPlanItem) #set($listPlanDetail=$!e.get(2)) < ...
- 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件
js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...
- IE浏览器的脚本文本框监听事件
一.IE8的文本框监听事件 由于在IE8所以input和propertychange都不能用,终于皇天不负有心人让我找到了这个:https://github.com/sophiebits/jquery ...
- JS事件 加载事件(onload)注意:1. 加载页面时,触发onload事件,事件写在<body>标签内。 2. 此节的加载页面,可理解为打开一个新页面时。
加载事件(onload) 事件会在页面加载完成后,立即发生,同时执行被调用的程序. 注意:1. 加载页面时,触发onload事件,事件写在<body>标签内. 2. 此节的加载页面,可理解 ...
- Chrome下关闭浏览器,关闭非脚本打开的页面
今天脚本了里写了一句话: window.close() 但是浏览器却报了警告提示:Scripts may close only the windows that were opened by it,而 ...
随机推荐
- Error:Execution failed for task ':app:validateSigningDebug'.
今天出差回来 第一天 把项目重新移植到新的电脑上 一运行 给我报错了 ! 这个是签名的路径错误 我们需要重新导一下路径就可以了 点击左上角 File -> project structu ...
- python中遇到的问题:IndentationError: unexpected indent
在Python中写下列代码的时候,出现错误:IndentationError: unexpected indent 分析:IndentationError是缩进的错误,查看源代码发现names开始的这 ...
- day1-字符串、列表
字符串操作: name = "Wills Qian" # 创建字符串变量 print(len(name)) # 打印字符串长度 print(name[0]) # 提取第一个字符W ...
- csp-s模拟64trade,sum,building题解
题面:https://www.cnblogs.com/Juve/articles/11639755.html trade: 70分sbdp,然后一直想优化,dp还是很好写的 正解是反悔贪心 维护一个小 ...
- 模拟——1031D
/* dp[i][j]表示到[i,j]的权值 cnt[i,j]表示到[i,j]还可以使用的修改的次数 cnt[i,j]=max(cnt[i-1,j],cnt[i,j-1]) 如果mp[i,j]!='a ...
- input 的 placeholder 样式修改
input::-webkit-input-placeholder{ color:#999999; } input::-moz-placeholder{ /* Mozilla Firefox 19+ * ...
- MyEclipse使用总结——在MyEclipse中新建Maven框架的web项目[转]
前面的文章我们已经在本机安装好了maven,同时在myeclipse中配置好了maven的插件. 链接如下: Maven安装----在Windows上安装Maven myeclipse安装maven插 ...
- VS2010-MFC(VS2010应用程序工程中文件的组成结构)
转自:http://www.jizhuomi.com/software/143.html 用应用程序向导生成框架程序后,我们可以在之前设置的Location下看到以解决方案名命名的文件夹,此文件夹中包 ...
- PAT甲级——A1085 Perfect Sequence
Given a sequence of positive integers and another positive integer p. The sequence is said to be a p ...
- java线程池的使用学习
目录 1. 线程池的创建 2. 线程池的运行规则 3. 线程池的关闭 4. 线程池的使用场合 5. 线程池大小的设置 6 实现举例 1. 线程池的创建 线程池的创建使用ThreadPoolExecut ...