最近工作中有个需求:点击按钮时打开一个页面,此处取名为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. Mybatis-generator/通用Mapper/Mybatis-Plus对比

    mybatis-plus-boot-starter和mybatis-spring-boot-starter冲突导致MapperScan失效问题还没有解决,只能不用mybatis-plus-boot-s ...

  2. 自定义StringBuilder类拼接非空字符串

    主要目的: 为了拼接多个非空字符串,还能达到链式的装X效果这里不考虑线程安全,所以使用StringBuilder快速拼接非空内容,中间用","作为分隔. 代码如下: package ...

  3. 0906NOIP模拟测试赛后总结

    我进前十辣.然而有10个大佬去学LCT了于是没有考试. Dybala神和exzkt神分-rank1,奶风神和林哥分-rank3,wc.miemeng和DuanYue神140分-rank5. 我.ooo ...

  4. C++函数模板&类模板

    函数模板 模板概念及语法 主要目的,简化代码,减少重复代码.基本语法格式:  template<class T> 或者 template<typename T> //末尾不加分 ...

  5. LUOGU P1505 [国家集训队]旅游 (树链剖分+线段树)

    传送门 解题思路 快被调死的码农题,,,其实就是一个边权下放到点权的线段树+树剖. #include<iostream> #include<cstdio> #include&l ...

  6. spark Infinate 的处理

    去掉infinity数据的方法: absperrordf_rdd = absperrordf.rdd.filter(lambda x: (np.isinf(float(x.avgperror)) == ...

  7. 左神算法进阶班5_4设计可以变更的缓存结构(LRU)

    [题目] 设计一种缓存结构,该结构在构造时确定大小,假设大小为K,并有两个功能: set(key, value):将记录(key, value)插入该结构. get(key):返回key对应的valu ...

  8. oracle中准确控制job的下次运行时间(next date)

    用过ORACLE的JOB的朋友也许都能够感觉到它的强大,和JAVA中的quartz有异曲同工之妙,可以少了很多的重复劳动:但是也会有许多问题,就是执行时间段和执行时间比较不容易确定. 这其实都是我们还 ...

  9. Linux-c给线程取名字

    https://blog.csdn.net/jasonchen_gbd/article/details/51308638 #define wtm_set_thread_name(n) ({ \ ] = ...

  10. sql 2000 or sql2005 数据库日志删除

    数据库日志清理(sql 2000 or sql2005)DUMP TRANSACTION crm WITH NO_LOGBACKUP LOG crm WITH NO_LOGDBCC SHRINKDAT ...