javascript - 如何在打开新窗口后聚焦主网页？

Question

我希望能够在打开新窗口/选项卡后将焦点集中在原始页面上，就像在该网站上所做的那样:http://www.vouchercodes.co.uk/laredoute.co.uk

Answer 1

当您点击绿色按钮“获取代码并打开网站”时。

代码就在那里供您查看。我用firebug找到了<a>将单击事件绑定(bind)到在主浏览器窗口后面弹出的代码的对象。我向下滚动查看 global.js 文件，发现了这个:

基本上是.blur()对于支持它的浏览器，指定的弹出窗口上的 会将焦点传递回主窗口，并且 return false;将确保链接不会在当前窗口中打开，这是默认行为。向下滚动下面的代码，您会在底部看到它。

// -- VoucherClick --
// This baby does the funky stuff when the user clicks to reveal the voucher code
(function($) {
    $.fn.extend({
        voucherClick: function(config) {    

            return this.each(function() {

                // What is the objects parent?
                var theObject = $(this);                
                if ($(this).hasClass('the-image')) {    
                    var theParent = theObject.parent().parent();
                } else {
                    var theParent = theObject.parent().parent().parent();               
                }

                theObject.click(function() {

                    // Revealed codes have a light yellow background
                    // First we remove the background of any currently selected vouchers            
                    $('.selected-voucher').css('backgroundColor','#fff').removeClass('selected-voucher');       

                    // Now we add the yellow background. We have to check what was clicked as it affects
                    // how far up the DOM tree the voucher DIV starts

                    // We also must check if we are on an indiviual page with an expired voucher,
                    // because the yellow background can overlap the left hand edge of the voucher
                    if (theParent.parent().hasClass('individual-expired')) {                        
                    } else {                                                        
                        theParent.css('backgroundColor','#ffffee').addClass('selected-voucher');
                    }                   

                    // Check to see if the voucher has alread been revealed - we only want to run this
                    // if it hasn't yet been clicked                
                    if (!theParent.data('voucherRevealed')) {   

                        // Make a note that this voucher has been clicked
                        theParent.data('voucherRevealed', true)

                        // Make a note of the voucher code and create the revealed code module          
                        var thisCode = theParent.find('strong').html();

                        // If the code is over 18 characters, we need to reduce the font size
                        if (thisCode.length > 8) {
                            thisCode = '<span class="revealedVoucherCode small">' + thisCode + '</span>';
                        } else {
                            thisCode = '<span class="revealedVoucherCode">' + thisCode + '</span>';                     
                        }

                        // Fade out the initial module and fade in the revealed voucher module
                        theParent.find('.code-wrapper').fadeOut('normal', function() {
                            // If it's an individual page there is no H3
                            if (theParent.find('h3').length == 0){
                                // So we add the revealed module after the dates
                                theParent.find('.dates').after('<div class="revealedVoucher">' + thisCode + '</div>');
                            } else {
                                theParent.find('h3').after('<div class="revealedVoucher">' + thisCode + '</div>');
                            }
                            theParent.find('.revealedVoucher').fadeIn();
                        })
                    }

                    // Open the merchant link in a new window
                    var mer_window = window.open(theObject.attr('href'), '_blank', 'toolbar=1,location=1,directories=1,scrollbars=1,resizable=1,status=1,menubar=1');

                    // Where browsers support it, let's pop this new window BEHIND the current window
                    if (typeof mer_window === "object") {
                        mer_window.blur();
                    }

                    // Reveal the What Just Happened Text, which was set up in the VoucherInit function
                    theParent.find('.what-just-happened').slideDown();

                    // Don't open the link in this current window
                    return false;

                }); // end theObject click function
            }) // end this.each function

        } // end function(config)
    }) // end $.fn.extend

}) (jQuery);