ตรวจหาป๊อปอัปที่ถูกบล็อกใน Chrome


103

ฉันทราบถึงเทคนิคจาวาสคริปต์ในการตรวจสอบว่าป๊อปอัปถูกบล็อกในเบราว์เซอร์อื่นหรือไม่ (ตามที่อธิบายไว้ในคำตอบสำหรับคำถามนี้ ) นี่คือการทดสอบพื้นฐาน:

var newWin = window.open(url);

if(!newWin || newWin.closed || typeof newWin.closed=='undefined')
{
    //POPUP BLOCKED
}

แต่สิ่งนี้ใช้ไม่ได้ใน Chrome ไม่สามารถเข้าถึงส่วน "POPUP BLOCKED" ได้เมื่อป๊อปอัปถูกบล็อก

แน่นอนว่าการทดสอบใช้งานได้ในระดับหนึ่งเนื่องจาก Chrome ไม่ได้ปิดกั้นป๊อปอัปจริง ๆ แต่จะเปิดขึ้นในหน้าต่างย่อขนาดเล็กที่มุมล่างขวาซึ่งแสดงรายการป๊อปอัปที่ "ถูกบล็อก"

สิ่งที่ฉันต้องการจะทำคือสามารถบอกได้ว่าป๊อปอัปถูกบล็อกโดยตัวป้องกันป๊อปอัปของ Chrome หรือไม่ ฉันพยายามหลีกเลี่ยงการดมกลิ่นของเบราว์เซอร์เพื่อสนับสนุนการตรวจจับคุณลักษณะ มีวิธีดำเนินการโดยไม่ต้องใช้เบราว์เซอร์หรือไม่?

แก้ไข : ฉันได้พยายามในขณะนี้ทำให้การใช้newWin.outerHeight, newWin.leftและคุณสมบัติอื่น ๆ ที่คล้ายกันเพื่อบรรลุนี้ Google Chrome จะคืนค่าตำแหน่งและความสูงทั้งหมดเป็น 0 เมื่อป๊อปอัปถูกบล็อก

น่าเสียดายที่มันยังคืนค่าเดียวกันแม้ว่าป๊อปอัปจะเปิดขึ้นโดยไม่ทราบระยะเวลาก็ตาม หลังจากช่วงเวลามหัศจรรย์ (สองสามวินาทีในการทดสอบของฉัน) ข้อมูลตำแหน่งและขนาดจะถูกส่งกลับเป็นค่าที่ถูกต้อง กล่าวอีกนัยหนึ่งฉันยังไม่ใกล้เคียงกับการหาข้อมูลนี้ ความช่วยเหลือใด ๆ จะได้รับการชื่นชม


Yoav ตำแหน่งจะแสดงเหมือนกันไม่ว่าป๊อปอัปจะถูกบล็อกหรือไม่ก็ตาม ใครมีคำตอบที่ไม่เกี่ยวข้องกับการทำให้ผู้ใช้รอ 3.5 วินาที?

โซลูชันล่าสุดจาก InvisibleBacon และ Andy ไม่ทำงานใน Chrome 10: ข้อความ "failed for chrome" จะปรากฏขึ้นแม้ว่าจะแสดงป๊อปอัปการทดสอบสำเร็จก็ตาม ความคิดใด ๆ ?

ฉันคิดว่าคำถามใหม่น่าจะเป็นไปตามลำดับเนื่องจากโซลูชันเหล่านี้บางส่วนดูเหมือนจะใช้ได้กับ Chrome เวอร์ชันแรกเท่านั้น
Bryan Field

1
@ George Bailey ฉันเห็นด้วย แต่เพื่อความชัดเจนบางคนใช้งานได้ใน Chrome เวอร์ชันปัจจุบัน (19) แนวคิดดั้งเดิมของ Andrew ในการใช้ outerHeight (หรือ screenX ตามที่คนอื่นแนะนำ) ทำงานได้ดีสำหรับฉันรวมกับแนวทาง setTimeout แต่ใช่การพยายามทำความเข้าใจกับคำตอบทั้งหมดนี้ทำให้สับสนมากจนกระทั่งฉันทำการทดสอบด้วยตัวเอง
regularmike

ลองสิ่งนี้: stackoverflow.com/a/31299484/1927014
Vlada

คำตอบ:


66

"ช่วงเวลามหัศจรรย์" ที่คุณพูดถึงน่าจะเป็นตอนที่โหลด DOM ของป๊อปอัปแล้ว หรือมิฉะนั้นอาจเป็นเมื่อโหลดทุกอย่าง (รูปภาพ CSS นอกเรือ ฯลฯ ) แล้ว คุณสามารถทดสอบสิ่งนี้ได้อย่างง่ายดายโดยการเพิ่มกราฟิกขนาดใหญ่ลงในป๊อปอัป (ล้างแคชของคุณก่อน!) หากคุณใช้ Javascript Framework เช่น jQuery (หรือสิ่งที่คล้ายกัน) คุณสามารถใช้เหตุการณ์ ready () (หรือสิ่งที่คล้ายกัน) เพื่อรอให้ DOM โหลดก่อนที่จะตรวจสอบการชดเชยหน้าต่าง อันตรายในกรณีนี้คือการตรวจจับ Safari ทำงานในลักษณะที่ขัดแย้งกัน: DOM ของป๊อปอัปจะไม่พร้อมใช้งาน () ใน Safari เนื่องจากจะให้หมายเลขอ้างอิงที่ถูกต้องสำหรับหน้าต่างที่คุณพยายามเปิดไม่ว่าจะเปิดขึ้นจริงหรือ ไม่. (อันที่จริงฉันเชื่อว่ารหัสทดสอบป๊อปอัปด้านบนของคุณใช้ไม่ได้กับซาฟารี)

ฉันคิดว่าสิ่งที่ดีที่สุดที่คุณสามารถทำได้คือสรุปการทดสอบของคุณใน setTimeout () และให้ป๊อปอัป 3-5 วินาทีเพื่อทำการโหลดให้เสร็จสิ้นก่อนที่จะทำการทดสอบ มันไม่สมบูรณ์แบบ แต่ควรทำงานอย่างน้อย 95% ของเวลา

นี่คือรหัสที่ฉันใช้สำหรับการตรวจจับข้ามเบราว์เซอร์โดยไม่มีส่วนของ Chrome

function _hasPopupBlocker(poppedWindow) {
    var result = false;

    try {
        if (typeof poppedWindow == 'undefined') {
            // Safari with popup blocker... leaves the popup window handle undefined
            result = true;
        }
        else if (poppedWindow && poppedWindow.closed) {
            // This happens if the user opens and closes the client window...
            // Confusing because the handle is still available, but it's in a "closed" state.
            // We're not saying that the window is not being blocked, we're just saying
            // that the window has been closed before the test could be run.
            result = false;
        }
        else if (poppedWindow && poppedWindow.test) {
            // This is the actual test. The client window should be fine.
            result = false;
        }
        else {
            // Else we'll assume the window is not OK
            result = true;
        }

    } catch (err) {
        //if (console) {
        //    console.warn("Could not access popup window", err);
        //}
    }

    return result;
}

สิ่งที่ฉันทำคือเรียกใช้การทดสอบนี้จากผู้ปกครองและรวมไว้ใน setTimeout () ให้หน้าต่างย่อยโหลด 3-5 วินาที ในหน้าต่างลูกคุณต้องเพิ่มฟังก์ชันทดสอบ:

การทดสอบฟังก์ชัน () {}

ตัวตรวจจับตัวป้องกันป๊อปอัปจะทดสอบเพื่อดูว่ามีฟังก์ชัน "ทดสอบ" เป็นสมาชิกของหน้าต่างย่อยหรือไม่

เพิ่ม 15 มิถุนายน 2558:

ฉันคิดว่าวิธีที่ทันสมัยในการจัดการสิ่งนี้คือการใช้ window.postMessage () เพื่อให้เด็กแจ้งผู้ปกครองว่ามีการโหลดหน้าต่างแล้ว วิธีการนี้คล้ายกัน (เด็กบอกผู้ปกครองว่าโหลดแล้ว) แต่วิธีการสื่อสารดีขึ้น ฉันสามารถข้ามโดเมนได้ตั้งแต่เด็ก:

$(window).load(function() {
  this.opener.postMessage({'loaded': true}, "*");
  this.close();
});

ผู้ปกครองรับฟังข้อความนี้โดยใช้:

$(window).on('message', function(event) {     
  alert(event.originalEvent.data.loaded)
}); 

หวังว่านี่จะช่วยได้


รวยคุณเป็นกูรูป๊อปอัพจาวาสคริปต์ ขอบคุณ. นั่นคือสิ่งที่ฉันต้องการ
Andrew Ensley

4
มีการอัปเดตเกี่ยวกับเรื่องนี้หรือไม่? ดูเหมือนจะไม่ทำงานอีกต่อไป ... โดยเฉพาะใน Chrome
Chris Wagner

ฉันคิดว่าฉันพบวิธีที่จะทำให้สิ่งนี้ใช้ได้กับ Chrome เวอร์ชันใหม่ ดูคำตอบของฉันสำหรับรายละเอียด
InvisibleBacon

2
โดยทั่วไปมีข้อบกพร่องใน Chrome แม้ว่าจะซ่อนป๊อปอัป แต่ก็ยังดำเนินการและคุณยังคงได้รับวัตถุหน้าต่างกลับมาดังนั้นการตรวจสอบปกติจึงไม่ได้ผล นี่คือวิธีแก้ปัญหาที่เหมาะกับฉัน: var popup = window.open (url); ถ้า (ป๊อปอัป) {popup.onload = function () {console.log (popup.innerHeight> 0? 'open': 'block'); }} else {console.log ('ถูกบล็อก'); } ตัวอย่างการทำงานที่นี่: jsbin.com/uticev/3
Remy Sharp

1
คำตอบนี้ไม่ถูกต้องอีกต่อไปโปรดเปลี่ยนเป็นคำตอบของ @Predrag Stojadinović
Lucas B

16

การปรับปรุงเพียงครั้งเดียวสำหรับสไนเพทของ InvisibleBacon (ทดสอบใน IE9, Safari 5, Chrome 9 และ FF 3.6):

var myPopup = window.open("popupcheck.htm", "", "directories=no,height=150,width=150,menubar=no,resizable=no,scrollbars=no,status=no,titlebar=no,top=0,location=no");
if (!myPopup)
    alert("failed for most browsers");
else {
    myPopup.onload = function() {
        setTimeout(function() {
            if (myPopup.screenX === 0) {
                alert("failed for chrome");
            } else {
                // close the test window if popups are allowed.
                myPopup.close();  
            }
        }, 0);
    };
}

ทำไมต้องปิดหน้าต่างถ้าอนุญาตให้ใช้ป๊อปอัป นั่นจะเป็นการปิดป๊อปอัปที่คุณต้องการเปิดตั้งแต่แรกไม่ใช่หรือ?
elemjay19

3
ใช้ jQuery แทนการโหลดฉันจะทำ $ (myPopup) .ready () การทำงานในเครื่อง IE ของฉันเร็วเกินไปและ "onload" ได้เกิดขึ้นแล้ว
Matt Connolly

12

ต่อไปนี้เป็นโซลูชันjQueryสำหรับการตรวจสอบตัวป้องกันป๊อปอัป ได้รับการทดสอบใน FF (v11), Safari (v6), Chrome (v23.0.127.95) และ IE (v7 & v9) อัปเดตฟังก์ชัน _displayError เพื่อจัดการข้อความแสดงข้อผิดพลาดตามที่เห็นสมควร

var popupBlockerChecker = {
        check: function(popup_window){
            var _scope = this;
            if (popup_window) {
                if(/chrome/.test(navigator.userAgent.toLowerCase())){
                    setTimeout(function () {
                        _scope._is_popup_blocked(_scope, popup_window);
                     },200);
                }else{
                    popup_window.onload = function () {
                        _scope._is_popup_blocked(_scope, popup_window);
                    };
                }
            }else{
                _scope._displayError();
            }
        },
        _is_popup_blocked: function(scope, popup_window){
            if ((popup_window.innerHeight > 0)==false){ scope._displayError(); }
        },
        _displayError: function(){
            alert("Popup Blocker is enabled! Please add this site to your exception list.");
        }
    };

การใช้งาน:

var popup = window.open("http://www.google.ca", '_blank');
popupBlockerChecker.check(popup);

หวังว่านี่จะช่วยได้! :)


นี่เป็นประโยชน์จริงๆ ขอบคุณสำหรับการแบ่งปัน.
Suvendu Shekhar Giri

ยินดีต้อนรับคุณ Suvendu ฉันดีใจที่คุณพบว่ามีประโยชน์! ขอให้สนุกกับการเขียนโค้ด! :)
Kevin B

1
ฉันปรับรหัสนี้เพื่อส่งผ่าน / รอบ ๆ URL ที่พยายามจะเปิด สิ่งนี้ช่วยให้เมธอด _displayError () แสดงการแจ้งเตือน (ฉันใช้ toastr) เพื่อแจ้งให้ผู้ใช้ทราบว่ามีปัญหาและให้ลิงก์ที่คลิกได้ซึ่งจะหลีกเลี่ยงตัวบล็อกส่วนใหญ่เนื่องจากเป็นลิงก์โดยตรง ขอบคุณสำหรับการแบ่งปัน!!
Tyler Forsythe

@TylerForsythe คุณมีข้อมูลเพิ่มเติมเกี่ยวกับโซลูชันของคุณหรือไม่? ชอบที่จะสามารถให้ลิงก์ที่คลิกได้โดยตรงไปยังเนื้อหา
Joshua Dance

1
@JoshuaDance นี่คือส่วนสำคัญที่ฉันเพิ่งสร้างขึ้นเพื่อสาธิตโค้ดที่แก้ไขของฉันและวิธีเรียกใช้ หวังว่าจะช่วยได้! gist.github.com/tylerforsythe/452ceaad62f507d7cb7bd7ddbffe650c
Tyler Forsythe

10

คำตอบของ Rich จะไม่ทำงานอีกต่อไปสำหรับ Chrome ดูเหมือนว่า Chrome จะเรียกใช้ Javascript ในหน้าต่างป๊อปอัพจริงๆ ฉันตรวจสอบค่า screenX เป็น 0 เพื่อตรวจสอบป๊อปอัปที่ถูกบล็อก ฉันยังคิดว่าฉันพบวิธีที่จะรับประกันว่าทรัพย์สินนี้เป็นที่สิ้นสุดก่อนที่จะตรวจสอบ สิ่งนี้ใช้ได้กับป๊อปอัปบนโดเมนของคุณเท่านั้น แต่คุณสามารถเพิ่มตัวจัดการ onload ได้ดังนี้:

var myPopup = window.open("site-on-my-domain", "screenX=100");
if (!myPopup)
    alert("failed for most browsers");
else {
    myPopup.onload = function() {
        setTimeout(function() {
            if (myPopup.screenX === 0)
                alert("failed for chrome");
        }, 0);
    };
}

ตามที่หลายคนรายงานคุณสมบัติ "screenX" บางครั้งรายงานว่าไม่ใช่ศูนย์สำหรับป๊อปอัปที่ล้มเหลวแม้ว่าจะโหลดแล้วก็ตาม ฉันพบพฤติกรรมนี้เช่นกัน แต่ถ้าคุณเพิ่มการตรวจสอบหลังจากหมดเวลาเป็นศูนย์ ms คุณสมบัติ screenX จะแสดงค่าที่สอดคล้องกันเสมอ

โปรดแจ้งให้เราทราบหากมีวิธีทำให้สคริปต์นี้มีประสิทธิภาพมากขึ้น ดูเหมือนว่าจะทำงานเพื่อจุดประสงค์ของฉันแม้ว่า


มันไม่ได้สำหรับฉันonloadไม่เคยมอดไหม้
ใบ

9

สิ่งนี้ใช้ได้ผลสำหรับฉัน:

    cope.PopupTest.params = 'height=1,width=1,left=-100,top=-100,location=no,toolbar=no,menubar=no,scrollbars=no,resizable=no,directories=no,status=no';
    cope.PopupTest.testWindow = window.open("popupTest.htm", "popupTest", cope.PopupTest.params);

    if( !cope.PopupTest.testWindow
        || cope.PopupTest.testWindow.closed
        || (typeof cope.PopupTest.testWindow.closed=='undefined')
        || cope.PopupTest.testWindow.outerHeight == 0
        || cope.PopupTest.testWindow.outerWidth == 0
        ) {
        // pop-ups ARE blocked
        document.location.href = 'popupsBlocked.htm';
    }
    else {
        // pop-ups are NOT blocked
        cope.PopupTest.testWindow.close();
    }

outerHeight และ outerWidth ใช้สำหรับโครเมี่ยมเนื่องจากเคล็ดลับ "about: blank" จากด้านบนใช้ไม่ได้กับ Chrome อีกต่อไป


1
จับการเปลี่ยนแปลงของ Chrome ได้ดีและขอขอบคุณที่อัปเดตที่นี่ คำตอบของคุณควรถูกทำเครื่องหมายว่าถูกต้อง
Lucas B

outerWidth และ outerHeight ใช้ไม่ได้ใน Chrome อีกต่อไป
Roman

5

ฉันจะคัดลอก / วางคำตอบที่ให้ไว้ที่นี่: https://stackoverflow.com/a/27725432/892099โดย DanielB ใช้งานได้กับ chrome 40 และสะอาดมาก ไม่มีการแฮ็กสกปรกหรือการรอคอย

function popup(urlToOpen) {
  var popup_window=window.open(urlToOpen,"myWindow","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, copyhistory=yes, width=400, height=400");            
  try {
    popup_window.focus();   
  }
  catch (e) {
    alert("Pop-up Blocker is enabled! Please add this site to your exception list.");
  }
}

3

วิธีการเป็นPromiseอย่างไร?

const openPopUp = (...args) => new Promise(s => {
  const win = window.open(...args)
  if (!win || win.closed) return s()
  setTimeout(() => (win.innerHeight > 0 && !win.closed) ? s(win) : s(), 200)
})

และคุณสามารถใช้งานได้อย่างคลาสสิก window.open

const win = await openPopUp('popuptest.htm', 'popuptest')
if (!win) {
  // popup closed or blocked, handle alternative case
}

คุณสามารถเปลี่ยนรหัสเพื่อให้ผิดสัญญาแทนที่จะส่งคืนundefinedฉันแค่คิดว่าifเป็นขั้นตอนการควบคุมที่ง่ายกว่าtry / catchสำหรับกรณีนี้


ใช้สำหรับตรวจจับ adblockers ส่วนขยายของ Chrome +1
Micheal C Wallas

2

ตรวจสอบตำแหน่งของหน้าต่างที่สัมพันธ์กับผู้ปกครอง Chrome ทำให้หน้าต่างปรากฏเกือบนอกหน้าจอ


ฉันจะลองและแจ้งให้คุณทราบผลของฉัน ขอบคุณ.
Andrew Ensley

Google Chrome รายงานการชดเชยด้านซ้ายและด้านบนเป็น 0 เมื่อป๊อปอัป "ถูกบล็อก" ฉันคิดว่านี่เป็นตั๋วทองคำของฉัน แต่เปล่าเลย มันรายงานออฟเซ็ตเป็น 0 ทันทีหลังจากเปิดจริงเช่นกัน เมื่อถึงจุดมหัศจรรย์ในอนาคตหลังจากเปิดการชดเชยด้านบนและด้านซ้ายจะถูกรายงานอย่างถูกต้อง
Andrew Ensley

ตรวจสอบโพสต์ของฉันเพื่อหาวิธีที่รับประกันได้ว่ามีการตั้งค่าชดเชยก่อนตรวจ
InvisibleBacon

2

ฉันมีปัญหาคล้ายกันกับป๊อปอัปไม่เปิดใน Chrome ฉันรู้สึกหงุดหงิดเพราะฉันไม่ได้พยายามทำอะไรส่อเสียดเช่นป๊อปอัป onload เพียงแค่เปิดหน้าต่างเมื่อผู้ใช้คลิก ฉันรู้สึกผิดหวังเป็นสองเท่าเพราะการเรียกใช้ฟังก์ชันของฉันซึ่งรวมถึง window.open () จากบรรทัดคำสั่ง firebug ใช้งานได้ในขณะที่การคลิกลิงก์ของฉันไม่ได้ผลจริง! นี่คือทางออกของฉัน:

ผิดวิธี: เรียกใช้ window.open () จาก event listener (ในกรณีของฉัน dojo.connect กับวิธีเหตุการณ์ onclick ของโหนด DOM)

dojo.connect(myNode, "onclick", function() {
    window.open();
}

วิธีที่ถูกต้อง: การกำหนดฟังก์ชันให้กับคุณสมบัติ onclick ของโหนดที่เรียกว่า window.open ()

myNode.onclick = function() {
    window.open();
}

และแน่นอนฉันยังสามารถทำผู้ฟังเหตุการณ์สำหรับเหตุการณ์ onclick เดียวกันนั้นได้หากต้องการ ด้วยการเปลี่ยนแปลงนี้ฉันสามารถเปิดหน้าต่างได้แม้ว่า Chrome จะตั้งค่าเป็น "ไม่อนุญาตให้ไซต์ใด ๆ แสดงป๊อปอัป" จอย.

หากใครก็ตามที่ฉลาดในวิธีการของ Chrome สามารถบอกพวกเราที่เหลือได้ว่าทำไมมันถึงสร้างความแตกต่างฉันก็ชอบที่จะได้ยินแม้ว่าฉันจะสงสัยว่ามันเป็นเพียงความพยายามที่จะปิดประตูป๊อปอัปแบบเป็นโปรแกรมที่เป็นอันตราย


ขอบคุณสำหรับการแบ่งปันการแก้ปัญหาของคุณ. มันได้ผล. นี่เป็นวิธีที่ดีที่สุดและสะอาดที่สุดในการเปิดป๊อปอัปใน Chrome คำตอบของคุณควรอยู่ด้านบน วิธีแก้ปัญหาที่เหลือเป็นเพียงการแฮ็ก "สกปรก"
Mandeep Janjua

2

นี่คือเวอร์ชันที่ใช้งานได้ใน Chrome การเปลี่ยนแปลงเล็กน้อยจากโซลูชันของ Rich แม้ว่าฉันจะเพิ่มในเสื้อคลุมที่จัดการกับเวลาด้วย

function checkPopupBlocked(poppedWindow) {
 setTimeout(function(){doCheckPopupBlocked(poppedWindow);}, 5000);
}

function doCheckPopupBlocked(poppedWindow) {

    var result = false;

    try {
        if (typeof poppedWindow == 'undefined') {
            // Safari with popup blocker... leaves the popup window handle undefined
            result = true;
        }
        else if (poppedWindow && poppedWindow.closed) {
            // This happens if the user opens and closes the client window...
            // Confusing because the handle is still available, but it's in a "closed" state.
            // We're not saying that the window is not being blocked, we're just saying
            // that the window has been closed before the test could be run.
            result = false;
        }
        else if (poppedWindow && poppedWindow.outerWidth == 0) {
            // This is usually Chrome's doing. The outerWidth (and most other size/location info)
         // will be left at 0, EVEN THOUGH the contents of the popup will exist (including the
         // test function we check for next). The outerWidth starts as 0, so a sufficient delay
         // after attempting to pop is needed.
            result = true;
        }
        else if (poppedWindow && poppedWindow.test) {
            // This is the actual test. The client window should be fine.
            result = false;
        }
        else {
            // Else we'll assume the window is not OK
            result = true;
        }

    } catch (err) {
        //if (console) {
        //    console.warn("Could not access popup window", err);
        //}
    }

    if(result)
     alert("The popup was blocked. You must allow popups to use this site.");
}

ในการใช้งานเพียงทำสิ่งนี้:

var popup=window.open('location',etc...);
checkPopupBlocked(popup);

หากป๊อปอัปถูกบล็อกข้อความแจ้งเตือนจะแสดงหลังจากระยะเวลาผ่อนผัน 5 วินาที (คุณสามารถปรับได้ แต่ 5 วินาทีควรจะค่อนข้างปลอดภัย)


2

ส่วนนี้รวมทั้งหมดข้างต้น - ด้วยเหตุผลบางประการ - StackOverflow ไม่รวมโค้ดบรรทัดแรกและบรรทัดสุดท้ายในบล็อกโค้ดด้านล่างดังนั้นฉันจึงเขียนบล็อกไว้ สำหรับคำอธิบายทั้งหมดและโค้ดที่เหลือ (ดาวน์โหลดได้) โปรดดู บล็อกของฉันที่ thecodeabode.blogspot.com

var PopupWarning = {

    init : function()
    {

        if(this.popups_are_disabled() == true)
        {
            this.redirect_to_instruction_page();
        }
    },

    redirect_to_instruction_page : function()
    {
        document.location.href = "http://thecodeabode.blogspot.com";
    },

    popups_are_disabled : function()
    {
        var popup = window.open("http://localhost/popup_with_chrome_js.html", "popup_tester", "width=1,height=1,left=0,top=0");

        if(!popup || popup.closed || typeof popup == 'undefined' || typeof popup.closed=='undefined')
        {
            return true;
        }

        window.focus();
        popup.blur();

        //
        // Chrome popup detection requires that the popup validates itself - so we need to give
        // the popup time to load, then call js on the popup itself
        //
        if(navigator && (navigator.userAgent.toLowerCase()).indexOf("chrome") > -1)
        {
            var on_load_test = function(){PopupWarning.test_chrome_popups(popup);};     
            var timer = setTimeout(on_load_test, 60);
            return;
        }


        popup.close();
        return false;
    },

    test_chrome_popups : function(popup)
    {
        if(popup && popup.chrome_popups_permitted && popup.chrome_popups_permitted() == true)
        {
            popup.close();
            return true;
        }

        //
        // If the popup js fails - popups are blocked
        //
        this.redirect_to_instruction_page();
    }
};

PopupWarning.init();

2

ว้าวมีวิธีแก้ปัญหามากมายที่นี่ นี่เป็นของฉันมันใช้โซลูชันที่นำมาจากคำตอบที่ยอมรับในปัจจุบัน (ซึ่งใช้ไม่ได้ใน Chrome รุ่นล่าสุดและต้องมีการรวมไว้ในช่วงหมดเวลา) รวมถึงโซลูชันที่เกี่ยวข้องในเธรดนี้ (ซึ่งจริงๆแล้วคือ vanilla JS ไม่ใช่ jQuery) .

Mine ใช้สถาปัตยกรรมการโทรกลับซึ่งจะถูกส่งtrueเมื่อป๊อปอัปถูกบล็อกและfalseอื่น ๆ

window.isPopupBlocked = function(popup_window, cb)
{
    var CHROME_CHECK_TIME = 2000;       // the only way to detect this in Chrome is to wait a bit and see if the window is present

    function _is_popup_blocked(popup)
    {
        return !popup.innerHeight;
    }

    if (popup_window) {
        if (popup_window.closed) {
            // opened OK but was closed before we checked
            cb(false);
            return;
        }
        if (/chrome/.test(navigator.userAgent.toLowerCase())) {
            // wait a bit before testing the popup in chrome
            setTimeout(function() {
                cb(_is_popup_blocked(popup_window));
            }, CHROME_CHECK_TIME);
        } else {
            // for other browsers, add an onload event and check after that
            popup_window.onload = function() {
                cb(_is_popup_blocked(popup_window));
            };
        }
    } else {
        cb(true);
    }
};

1

คำตอบของเจสันเป็นวิธีเดียวที่ฉันคิดได้เช่นกัน แต่การอาศัยท่าแบบนั้นก็ค่อนข้างหลบ!

ทุกวันนี้คุณไม่จำเป็นต้องถามคำถามว่า“ ป๊อปอัปที่ไม่พึงประสงค์ของฉันถูกบล็อกหรือไม่” เพราะคำตอบคือ“ ใช่” อยู่เสมอเบราว์เซอร์หลักทั้งหมดจะเปิดใช้ตัวป้องกันป๊อปอัปโดยค่าเริ่มต้น แนวทางที่ดีที่สุดคือ window.open () เพื่อตอบสนองต่อการคลิกโดยตรงซึ่งมักจะได้รับอนุญาต


2
ฉันรู้แนวทางปฏิบัติที่ดี ฯลฯ แต่ฉันอยู่ในสถานการณ์ที่ฉันต้องทำงานนี้ให้สำเร็จ นั่นเป็นเหตุผลที่ฉันถามคำถามนี้และไม่ใช่ "ฉันควร?
Andrew Ensley

1

สวัสดี

ฉันแก้ไขโซลูชันที่อธิบายไว้ข้างต้นเล็กน้อยและคิดว่าอย่างน้อยก็ใช้งานได้กับ Chrome วิธีแก้ปัญหาของฉันถูกสร้างขึ้นเพื่อตรวจสอบว่าป๊อปอัปถูกบล็อกเมื่อเปิดหน้าหลักไม่ใช่เมื่อเปิดป๊อปอัป แต่ฉันแน่ใจว่ามีบางคนที่สามารถแก้ไขได้ :-) ข้อเสียคือหน้าต่างป๊อปอัปจะปรากฏขึ้น สองสามวินาที (อาจจะสั้นลงเล็กน้อย) เมื่อไม่มีตัวป้องกันป๊อปอัป

ฉันใส่ไว้ในส่วนของหน้าต่าง 'หลัก' ของฉัน

<script type="text/JavaScript" language="JavaScript">

 var mine = window.open('popuptest.htm','popuptest','width=1px,height=1px,left=0,top=0,scrollbars=no');
 if(!mine|| mine.closed || typeof mine.closed=='undefined')
  {
    popUpsBlocked = true       
    alert('Popup blocker detected ');
    if(mine)
      mine.close();
 }
 else
 {
    popUpsBlocked = false    
    var cookieCheckTimer = null;
    cookieCheckTimer =  setTimeout('testPopup();', 3500);
 }


function testPopup()
{
  if(mine)
  {
    if(mine.test())
    {
       popUpsBlocked = false;
    }
    else
    {
        alert('Popup blocker detected ');
         popUpsBlocked = true;
     }
    mine.close();
}

} 
</script>

popuptest มีลักษณะดังนี้:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Popup test</title>
<script type="text/javascript" language="Javascript">
   function test() {if(window.innerHeight!=0){return true;} else return false;}
</script>
</head>

<body>
</body>
</html>

ขณะที่ฉันเรียกใช้ฟังก์ชันทดสอบในหน้าป๊อปอัปหลังจาก 3500 มิลลิวินาที Chrome ได้ตั้งค่าความสูงด้านในอย่างถูกต้อง

ฉันใช้ตัวแปร popUpsBlocked เพื่อทราบว่ามีการแสดงป๊อปอัปหรือไม่ในจาวาสคริปต์อื่น กล่าวคือ

function ShowConfirmationMessage()
{
if(popUpsBlocked)
 { 
  alert('Popups are blocked, can not display confirmation popup. A mail will be sent with the confirmation.');
 } 
 else
 { 
  displayConfirmationPopup();
 }
 mailConfirmation();
}

น่าเสียดายที่ถือว่าหน้าเว็บที่คุณพยายามสร้างขึ้นนั้นถูกควบคุมโดยเรา ฉันต้องการเปิดเพจภายนอกที่ฉันไม่สามารถควบคุมได้
โรมัน

1
function openPopUpWindow(format)
{   
    var win = window.open('popupShow.html',
                          'ReportViewer',
                          'width=920px,height=720px,left=50px,top=20px,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=1,maximize:yes,scrollbars=0');

    if (win == null || typeof(win) == "undefined" || (win == null && win.outerWidth == 0) || (win != null && win.outerHeight == 0) || win.test == "undefined") 
    {
        alert("The popup was blocked. You must allow popups to use this site.");  
    }
    else if (win)
    {
        win.onload = function()
        {          
            if (win.screenX === 0) {
                alert("The popup was blocked. You must allow popups to use this site.");
                win.close();
            } 
        };
    }
}

0

เท่าที่ฉันสามารถบอกได้ (จากสิ่งที่ฉันทดสอบ) Chrome ส่งคืนวัตถุหน้าต่างที่มีตำแหน่งเป็น 'about: blank' ดังนั้นสิ่งต่อไปนี้ควรใช้ได้กับเบราว์เซอร์ทั้งหมด:

var newWin = window.open(url);
if(!newWin || newWin.closed || typeof newWin.closed=='undefined' || newWin.location=='about:blank')
{
    //POPUP BLOCKED
}

ตำแหน่งจะยังคงเป็น "about: blank" แม้ว่าจะเป็นป๊อปอัปที่ไม่ถูกบล็อกก็ตาม ฉันทดสอบบน Chrome v28.0.1500.72
Roman
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.