• 点击事件弹出新的页面


      前两天将文本与测听功能的模块抽取到独立页面,出现了bug,页面本身没问题,主要是双击通话列表加密数据后异步跳转到2页面出现的问题。新窗口会被拦截掉,吐槽一下,为什么js中使用 window.open() 打开新的页面要被拦截,有什么关系!

      之前是用angular做的单页面应用,通过路由跳转,所以没有此问题,抽出来后发现了这个问题,会自动拦截,除非手动进行设置不拦截新弹出窗口,否则逃不掉拦截TOT。

      查了好多方法,什么模拟表单提交跳转,创建a标签跳转等,花样是挺多,可是都没什么用,该被拦截还被拦截,而且我还想说,百度出的页面60%的内容都是一样的。。。可不可以人性化一点,雷同的就判断时间扔掉算了。抄袭可耻!

      这里整理一下打开新页面知识点,虽然会被拦截,但单页面应用依然可以用到。

    js自带window.open():

    window.open(url, '_self');//本窗口打开
    window.open(url, '_blank');//新窗口打开
    //第二参数可省,默认新窗口打卡
    //还有一种打开新页面,重给地址的方法
     var openWin = window.open();
     openWin.location = url;
    var w = window.open();
    $.get(url, function (data) {
        w.location.href = url;
    })

    使用a标签,调用其点击方法:

    var a = "<a href='" + url + "' target='_blank' >jump</a>";
    $("body").append(a);
    var btn = $(a).get(0);
    var e = document.createEvent('MouseEvents');
    e.initEvent('click', true, true);
    btn.dispatchEvent(e);
    var a = document.createElement("a");
    a.setAttribute("href", url);
    a.setAttribute("target", "_blank");
    a.setAttribute("id", "openwin");
    document.body.appendChild(a);
    a.click();
    var a = '<a id="openWin" href=' + url + '></a>';
    $('body').append(a);
    $('#openWin').click();

    使用表单提交,跳转到新页面:

    var tempForm = '<form method="get" ' +
                    'target="_blank" ' +
                    'action="' + url + '">' +
                    '<input type="hidden" name="id" value="' +
                    value + '">'  + '</form>';    
    var $tempForm = $(tempForm);
    $("body").append($tempForm);
    $tempForm.submit();
    $tempForm.remove();

    后期遇到会继续添加,方法很多,但是都没有解决跳转弹出新页面问题,我只能感叹,浏览器才是最强的。

    加一句:异步请求后打开新页面是不行的,所以可以使用同步请求方式直接打开页面。

    附上大神回复:

    这样就能直接进行各种新页面打开啦!

  • 相关阅读:
    TCP通信 小例子
    Socket的简单使用
    Redis练习
    资料
    Redis封装帮助类
    使用Redis的基本操作
    Redis配置主从
    Redis基本设置
    clientHeight ,offsetHeight,style.height,scrollHeight的区别与联系
    服务器操作之如何绑定网站
  • 原文地址:https://www.cnblogs.com/guofan/p/6559614.html
Copyright © 2020-2023  润新知