1 问题描述

点击button按钮,提交页面的form表单,后台执行完毕后返回参数,前台页面需要该参数实现跳转,如何实现保留该原来的页面,并在浏览器选项卡新建一个页面,且不被浏览器拦截?

2 方法及问题

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

1)window.open()

在ajax的回调函数中调用window.open()实现会被浏览器拦截。

2)js模拟点击按钮事件

代码如下:

<html lang="utf-8">
<head>
<meta http-equiv="Content-type" Content ="text/html;"charset = "utf-8" >
</head>
<body>
<a id="alink" href="test" target="_blank" style="display: none"><span id="spanlink">test</span></a>
<input type="hidden" id="hdn_val" value="#">
<button type="button"  onclick="submit()">打开新页面</button>
<script>
        function new_window() { 
            while(1){
                var o_a = document.getElementById('hdn_val'); 
                var val=o_a.value;    
                if(val!="#"){
                    var a = document.getElementById('alink'); 
                    a.href=val;    
                    var a = document.getElementById('spanlink');  
                    a.click();  
                    break;
                }
            }
        }
 
        function ajax_submit_cb(data){
            var a = document.getElementById('hdn_val'); 
            a.value=data;        
        }
        
        function ajax_submit(){
            //模拟ajax有延时,与实际仍有差别,浏览器会检测回调对象,判断是否是鼠标实际点击的按钮
            var url='http://www.cnblogs.com/xiaopanlyu/';
            setTimeout(ajax_submit_cb(url),3000);
        }
        
        function submit(){
            ajax_submit();//该函数执行业务逻辑
            new_window();
        }
</script>
</body>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

3 总结

在实际ajax中执行时,必须保持点击按钮的时候  执行新页面的函数new_window 与 ajax函数是同步的,不能将new_window 放在ajax的结果中执行,否则新页面窗口就会被浏览器拦截。

demo:https://files.cnblogs.com/files/xiaopanlyu/test_new_window.zip

最新文章

  1. selenium RC+JAVA 运行所遇到的问题
  2. JAVA - HashMap,TreeMap迭代
  3. GET到新技能,SharpCEF,C#和JS的互相调用
  4. Java获取最后插入MySQL记录的自增ID值方法
  5. toad for sqlserver5.7
  6. HTML快速入门5——不规则表格、表格背景、边框颜色
  7. C#匿名类型(Anonymous Type)学习日记
  8. 诡异错误一: ValueError: embedded null character
  9. Error Code: 1360 - Trigger does not existQuery
  10. C# DataTable,DataSet,IList,IEnumerable 互转扩展属性
  11. #define指令
  12. vue的Http请求拦截及处理
  13. unicode utf-8 ascll编码比较
  14. ubuntu下的Nessus插件更新
  15. PPTP 在Centos 7.1 建立方法与失效处理
  16. 百度「Web 前端研发部」面试过程和常见问题 可能会采用哪些方法来面试 STAR 面试法 喜欢什么样的面试者 喜欢问的问题
  17. element-ui Steps步骤条组件源码分析整理笔记(九)
  18. IP的准确性
  19. js 动态控制 input 框 的只读属性
  20. Android-自定义ViewPager

热门文章

  1. 2-Eleventh Scrum Meeting20151211
  2. Python之路3【知识点】白话Python编码和文件操作(截载)
  3. springmvc下载文件
  4. Windows10 版本说明 From wiki 20190104
  5. PHP操作Redis数据库常用方法
  6. Hibernate性能优化之EHCache缓存
  7. java.util.concurrent BlockingQueue详解
  8. Java之资源文件读取
  9. Bootstrap中datetimepicker日期控件1899年问题解决
  10. myeclipse运行错误