js實現避免瀏覽器攔截彈出新頁面的方法


1 問題描述

點擊button按鈕,提交頁面的form表單,后台執行完畢后返回參數,前台頁面需要該參數實現跳轉,如何實現保留該原來的頁面,並在瀏覽器選項卡新建一個頁面,且不被瀏覽器攔截?

2 方法及問題

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>

3 總結

在實際ajax中執行時,必須保持點擊按鈕的時候  執行新頁面的函數new_window 與 ajax函數是同步的,不能將new_window 放在ajax的結果中執行,否則新頁面窗口就會被瀏覽器攔截。

 

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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM