360瀏覽器攔截彈窗,window.open方式打不開新頁面


window.open雖然在很多時候被廣大中小站長用於彈窗廣告的展示,所以廣受爭議,但是在業務需求中還是有很多場景需要用到此功能。然而,大多數瀏覽器對此都有一定的安全策略進行阻止,為此本文將針對以下瀏覽器進行測試。

 

Chrome16、Firefox10、360SE4.2、IE6、IE8

 

1、首先是最原始的在head標簽中加入

<script>

        

       window.open('about:blank');                            //空白頁

        

       window.open('http://www.1688.com/');   //非同源知名站點

        

       window.open('http://www.ginano.net/');  //同源

        

       window.open('http://www.aliren.org/');  //非同源非知名站點

        

       alert('over!');

        

</script>

 

結果顯示:Firefox、IE6、Chrome、360SE均阻止了彈出廣告;360SE在加載時,從第一個open開始阻止了彈窗並且停止了后續代碼的執行,連over都沒有彈出(這樣也行)。

 

2、在一個非a標簽上執行click事件,然后觸發行為

 

$('#not-a').click(function(){

    window.open('http://www.1688.com/');

    window.open('http://www.aliren.org/');

    window.open('http://www.ginano.net/');

    window.open('about:blank');

    alert('over!');

});

<span id="not-a">dddd</span>

結果顯示:除了IE和360SE不允許同時打開兩個及以上彈窗外,其他瀏覽器都能夠正常打開所有窗口,但是360SE居然同樣阻止彈窗的同時停止后后續的腳本執行!!

 

3、在一個a標簽上執行2中同樣的操作,得出的結論一致,在此不再累述。同樣從上面的測試中可見,對於打開多個窗口和打開單個窗口基本行為一致,只是在有些時候360SE這個號稱安全的瀏覽器做了一些額外的處理而已,所以接下來的測試將會只針對一個彈窗進行測試。如果不同網址對應的彈窗行為不同將會做進一步說明。

 

4、很多時候我們會根據ajax請求返回的結果來執行window.open操作,那么這個時候還能順利打開么?

 

$('#tag-a,#not-a').click(function(e){

      e.preventDefault();

      $.ajax({

          //async:false,

          url:'http://www.ginano.net/',

          success:function(){

              window.open('http://www.ginano.net/');

          }

     });

    //return true;

});

 

<a href="http://www.ddddd.com" id="tag-a">testa</a> 

     <span id="not-a">testb</span>

 

結果很意外的,360SE居然都能夠打開彈窗,而其他所有瀏覽器都一致的阻止了彈窗。

 

5、重復第4種情況的討論,修改ajax請求為同步請求,看看什么反應。結果顯示所有瀏覽器都能夠正常打開彈窗,因此得出結論:同步的操作能夠解除瀏覽器對彈窗的限制。

 

6、其實還有一種非常惡心的場景,當然可以采用其他方式避免。但是如果你又不得不這樣做呢?還是得看一下吧:

 

如果想希望通過點擊B的同時,使得某個鏈接A也被點擊(好像大多數的廣告需要被點擊,許多垃圾站就這樣做的),就需要用到此場景

 

$('#not-a').click(function(){

    $('#tag-a').click();

});

 

<a href="http://www.ddddd.com" id="tag-a">test</a> 

<span id="not-a">dddd</span>

 

而這種情況,所有瀏覽器都會對js觸發的和鼠標觸發的點擊事件做出正確的判斷,因此不會自動打開鏈接,從而影響垃圾站長們的心情。但是不急,從上面幾個場景的分析可以很容易得到以下的解決方法,那就是給所需要的鏈接增加一個click的事件,然后通過click事件注冊window.open來打開所需要的窗口:

$('#tag-a').click(function(){

    e.preventDefault();

    window.open($(this).attr('href'));

    return false;

});

因此就可以實現變態的需求了。。。站長們偷着樂吧!(其實這種方法和直接在觸發標簽中添加window.open事件別無兩樣)

 

從上面的分析可見,瀏覽器對於鼠標點擊和js觸發點擊是有不同的行為控制的,主要是需要判斷標准為事件的觸發起始必須為真實的鼠標事件,以及事件執行的連貫性。另外同時打開多個彈窗也會受到部分瀏覽器的安全屏蔽。所以,一開始就自動打開彈窗將會被阻止,而通過鼠標click事件來彈窗卻可以正常打開;而ajax的異步操作同樣會讓瀏覽器認為其為非連貫性的鼠標點擊事件,所以需要采用同步的請求來完成。


免責聲明!

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



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