zoukankan      html  css  js  c++  java
  • [js] post 方式打开新窗口

    一、前因

    一般我们是用 window.open(url,name,params); 打开新窗口, url 会携带一些参数, 但存在参数过多,引发url 过长截断,无法打开正确窗口, 所以我们需要使用 post 方式来实现新窗口打开。

    post 打开新窗口有两种方法:

    • ajax 形式
    • form 表单

    备注:
    url 为打开窗口链接;
    name 为窗口名称;
    params 为窗口参数,比如 height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no
    参数可参考 http://www.cnblogs.com/stswordman/archive/2006/06/02/415853.html

    二、实践

    方一 ajax 推荐!

    var params = {
        name: 'hxy',
        desc: 'dahuamao'
    };
    var win = window.open();   // 放在外面是因为浏览器可能会阻止新打开窗口,放在异步请求外面就ok !!!
    $.ajax({
        url: '/report/preview',
        type: 'post',
        data: params,
        asyn: false
    }).done(function(data) {
        var doc = win.document;
        doc.write(data);    // !!! 关键,接收后端的数据并进行新窗口写入
        doc.close();
    });
    

    方二 form 形式

    // post 提交参数
    var params = {
        name: 'hxy',
        desc: 'dahuamao'
    };
    var tempForm = $('<form style="display:none;" id="tempForm" method="POST" target="_blank" action="/report/preview"></form>');
    
    $.each(params, function(k,v) {
        console.log(k,v);
        var hideInput = $('<input name="' + k + '" value=' + v + ' type="hidden"/>');
        tempForm.append(hideInput);
    });
    
    $('body').append(tempForm);
    
    tempForm.submit();
    tempForm.remove();
    

    两种方法后端都一样,以node 后端 为例, 逻辑为 解析 post 请求的参数,并返回模板

        var params = this.request.body;
        yield this.render('report/index.html', {
            name: params.name,
            desc: params.desc
        });
    
    
    计划、执行、每天高效的活着学着
  • 相关阅读:
    JavaScript笔记
    第二个项目总结
    java设计模式-代理模式
    软件设计师-随笔笔记
    java设计模式-单例模式
    java-内部类介绍
    java-初识JVM运行及类加载过程
    java-java动态性之反射,动态编译,动态执行js及动态字节码操作
    java-初识注解Annotation
    java-网络编程入门
  • 原文地址:https://www.cnblogs.com/huxiaoyun90/p/5501700.html
Copyright © 2011-2022 走看看