最近工作中有个需求:点击按钮时打开一个页面,此处取名为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打开的页面时添加监听事件的更多相关文章

  1. 用window.showModalDialog()打开的页面Request.UrlReferrer为null

    今天在解决一个问题,怎么也找不到解决方案.我的一个窗体是IE通过window.showModalDialog()打开的,但为了防止用户手工输的地址,所以我需要判断是通过别的页面调整获得,用Reques ...

  2. window.onresize监听事件

    window.onresize监听事件 onresize 事件会在窗口或框架被调整大小时发生. 支持onresize的标签:<a>, <address>, <b>, ...

  3. vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式

    // 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...

  4. 让$(window).scroll()监听事件只执行一次

    可以用jQuery中的unbind()来进行事件解绑. $(window).scroll(function() { console.log("滚离顶部" + $(document) ...

  5. 打开jsp页面时,显示空白页。

    打开jsp页面时,显示空白页.   #foreach($e in $listPlanItem)          #set($listPlanDetail=$!e.get(2))        < ...

  6. 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件

    js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...

  7. IE浏览器的脚本文本框监听事件

    一.IE8的文本框监听事件 由于在IE8所以input和propertychange都不能用,终于皇天不负有心人让我找到了这个:https://github.com/sophiebits/jquery ...

  8. JS事件 加载事件(onload)注意:1. 加载页面时,触发onload事件,事件写在<body>标签内。 2. 此节的加载页面,可理解为打开一个新页面时。

    加载事件(onload) 事件会在页面加载完成后,立即发生,同时执行被调用的程序. 注意:1. 加载页面时,触发onload事件,事件写在<body>标签内. 2. 此节的加载页面,可理解 ...

  9. Chrome下关闭浏览器,关闭非脚本打开的页面

    今天脚本了里写了一句话: window.close() 但是浏览器却报了警告提示:Scripts may close only the windows that were opened by it,而 ...

随机推荐

  1. grep 查看前后几行和参数匹配

    如果在只是想匹配模式的上下几行,grep可以实现.   grep -5 'parttern' inputfile //打印匹配行的前后5行 grep -C 5 'parttern' inputfile ...

  2. Django流程

    开始具体的代码之旅前,先来宏观地看下Django是如何处理Http Resquest的,如下图: 假设你已经在浏览器输入了 http://127.0.0.1:8000/polls/,接下来浏览器会把请 ...

  3. leetcode146周赛-1131-绝对值表达式的最大值

    题目描述: class Solution: def maxAbsValExpr(self, arr1, arr2) -> int: def function(s1,s2): result1=[] ...

  4. 2016.9.15初中部上午NOIP普及组比赛总结

    2016.9.15初中部上午NOIP普及组比赛总结 2016.09.15[初中部 NOIP普及组 ]模拟赛 又翻车了!表示时超和空超很可恨! 进度 比赛:AC+0+0+20=120 改题:AC+80+ ...

  5. Laravel移除Cache-Control

    碰到一个问题,网站上线后,需要移除Cache-Control,就是下面这个东西 方案1 失败 参考网址:https://stackoverflow.com/questions/51821563/lar ...

  6. php中Sessions

    PHP Sessions  Session 中文译名叫做“会话”,其本来的含义是指有始有终的一系列动作/消息. PHP session 变量用于存储关于用户会话(session)的信息,或者更改用户会 ...

  7. IDEA本地SBT项目上传到SVN

    需求 将本地创建的一个项目上到SVN 网上很多从SVN下载到idea,提交.更新.删除等操作. 但是少有从本地上传一个项目到svn管理的案例 本文参考https://blog.csdn.net/cao ...

  8. mysql 乐观判断 校验

    说下场景, 用户账户 有 100 元钱,  他执行了两个操作,  A操作发红包发了80块钱, B操作 发红包 发了 70 ,并发, 假如没有 冻结这一说法,  两个操作都是去 查询余额, 还有100 ...

  9. 简单的JMS实例

    1.首先需要一台JMS的提供者,在这里我选择使用的是apache-activemq-5.3.2这个服务器,首先下载服务器并通过bin目录下的activemq.bat启动服务器,此时可通过http:// ...

  10. Hibernate调用Oracle的存储过程

    众所周知,当过多的使用存储过程,触发器等 数据库方言相关的应用时,应用程序的移植性会变差,特别是在Hibernate中使用这些,简直是讽刺,但是当今中国又有哪家公司做项目会关心应用程序的移植性呢? 现 ...