2015-12-09 37 views
0

當我點擊藍色文本Learn more我想重定向到谷歌,但是,它只是關閉div。超鏈接不會重定向用戶與jQuery

鏈接是在行146我的Javascript。

Demo

/** 
 
* \t 
 
* JQUERY EU COOKIE LAW POPUPS 
 
* version 1.0.0 
 
* 
 
* Code on Github: 
 
* https://github.com/wimagguc/jquery-eu-cookie-law-popup 
 
* 
 
* To see a live demo, go to: 
 
* http://www.wimagguc.com/2015/04/jquery-eu-cookie-law-popup/ 
 
* 
 
* by Richard Dancsi 
 
* http://www.wimagguc.com/ 
 
* 
 
*/ 
 

 
(function($) { 
 

 
// for ie9 doesn't support debug console >>> 
 
if (!window.console) window.console = {}; 
 
if (!window.console.log) window.console.log = function() { }; 
 
// ^^^ 
 

 
var EuCookieLawPopup = (function() { 
 

 
\t var _self = this; 
 

 
\t /////////////////////////////////////////////////////////////////////////////////////////////// 
 
\t // PARAMETERS (MODIFY THIS PART) ////////////////////////////////////////////////////////////// 
 
\t _self.params = { 
 
\t \t cookiePolicyUrl : '/cookie-privacy-policy/', 
 
\t \t popupPosition : 'bottom', 
 
\t \t colorStyle : 'default', 
 
\t \t compactStyle : false, 
 
\t \t popupTitle : 'This site uses cookies to store information on your computer', 
 
\t \t popupText : '', 
 
\t \t buttonContinueTitle : 'Learn more', 
 
\t \t buttonLearnmoreTitle : 'Learn more', 
 
\t \t buttonLearnmoreOpenInNewWindow : true, 
 
\t \t agreementExpiresInDays : 30, 
 
\t \t autoAcceptCookiePolicy : true, 
 
\t \t htmlMarkup : null 
 
\t }; 
 

 
\t /////////////////////////////////////////////////////////////////////////////////////////////// 
 
\t // VARIABLES USED BY THE FUNCTION (DON'T MODIFY THIS PART) //////////////////////////////////// 
 
\t _self.vars = { 
 
\t \t INITIALISED : false, 
 
\t \t HTML_MARKUP : null, 
 
\t \t COOKIE_NAME : 'EU_COOKIE_LAW_CONSENT' 
 
\t }; 
 

 
\t /////////////////////////////////////////////////////////////////////////////////////////////// 
 
\t // PRIVATE FUNCTIONS FOR MANIPULATING DATA //////////////////////////////////////////////////// 
 

 
\t // Overwrite default parameters if any of those is present 
 
\t var parseParameters = function(object, markup, settings) { 
 

 
\t \t if (object) { 
 
\t \t \t var className = $(object).attr('class') ? $(object).attr('class') : ''; 
 
\t \t \t if (className.indexOf('eupopup-top') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'top'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-fixedtop') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'fixedtop'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-bottomright') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'bottomright'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-bottomleft') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'bottomleft'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-bottom') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'bottom'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-block') > -1) { 
 
\t \t \t \t _self.params.popupPosition = 'block'; 
 
\t \t \t } 
 
\t \t \t if (className.indexOf('eupopup-color-default') > -1) { 
 
\t \t \t \t _self.params.colorStyle = 'default'; 
 
\t \t \t } 
 
\t \t \t else if (className.indexOf('eupopup-color-inverse') > -1) { 
 
\t \t \t \t _self.params.colorStyle = 'inverse'; 
 
\t \t \t } 
 
\t \t \t if (className.indexOf('eupopup-style-compact') > -1) { 
 
\t \t \t \t _self.params.compactStyle = true; 
 
\t \t \t } 
 
\t \t } 
 

 
\t \t if (markup) { 
 
\t \t \t _self.params.htmlMarkup = markup; 
 
\t \t } 
 

 
\t \t if (settings) { 
 
\t \t \t if (typeof settings.cookiePolicyUrl !== 'undefined') { 
 
\t \t \t \t _self.params.cookiePolicyUrl = settings.cookiePolicyUrl; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.popupPosition !== 'undefined') { 
 
\t \t \t \t _self.params.popupPosition = settings.popupPosition; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.colorStyle !== 'undefined') { 
 
\t \t \t \t _self.params.colorStyle = settings.colorStyle; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.popupTitle !== 'undefined') { 
 
\t \t \t \t _self.params.popupTitle = settings.popupTitle; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.popupText !== 'undefined') { 
 
\t \t \t \t _self.params.popupText = settings.popupText; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.buttonContinueTitle !== 'undefined') { 
 
\t \t \t \t _self.params.buttonContinueTitle = settings.buttonContinueTitle; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.buttonLearnmoreTitle !== 'undefined') { 
 
\t \t \t \t _self.params.buttonLearnmoreTitle = settings.buttonLearnmoreTitle; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.buttonLearnmoreOpenInNewWindow !== 'undefined') { 
 
\t \t \t \t _self.params.buttonLearnmoreOpenInNewWindow = settings.buttonLearnmoreOpenInNewWindow; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.agreementExpiresInDays !== 'undefined') { 
 
\t \t \t \t _self.params.agreementExpiresInDays = settings.agreementExpiresInDays; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.autoAcceptCookiePolicy !== 'undefined') { 
 
\t \t \t \t _self.params.autoAcceptCookiePolicy = settings.autoAcceptCookiePolicy; 
 
\t \t \t } 
 
\t \t \t if (typeof settings.htmlMarkup !== 'undefined') { 
 
\t \t \t \t _self.params.htmlMarkup = settings.htmlMarkup; 
 
\t \t \t } 
 
\t \t } 
 

 
\t }; 
 

 
\t var createHtmlMarkup = function() { 
 

 
\t \t if (_self.params.htmlMarkup) { 
 
\t \t \t return _self.params.htmlMarkup; 
 
\t \t } 
 

 
\t \t var html = 
 
\t \t \t '<div class="eupopup-container' + 
 
\t \t \t  ' eupopup-container-' + _self.params.popupPosition + 
 
\t \t \t  (_self.params.compactStyle ? ' eupopup-style-compact' : '') + 
 
\t \t \t \t ' eupopup-color-' + _self.params.colorStyle + '">' + 
 
\t \t \t \t '<div class="eupopup-head">' + _self.params.popupTitle + '</div>' + 
 
\t \t \t \t '<div class="eupopup-body">' + _self.params.popupText + '</div>' + 
 
\t \t \t \t '<div class="eupopup-buttons">' + 
 
\t \t \t \t '<a href="http://www.google.com/" class="eupopup-button eupopup-button_1">' + _self.params.buttonContinueTitle + '</a>' + 
 
\t \t \t \t '<a href="' + _self.params.cookiePolicyUrl + '"' + 
 
\t \t \t \t \t (_self.params.buttonLearnmoreOpenInNewWindow ? ' target=_blank ' : '') + 
 
\t \t \t \t \t ' class="eupopup-button eupopup-button_2">' + _self.params.buttonLearnmoreTitle + '</a>' + 
 
\t \t \t \t '<div class="clearfix"></div>' + 
 
\t \t \t \t '</div>' + 
 
\t \t \t \t '<a href="#" class="eupopup-closebutton"><img src="/images/icons/svg/close.svg"></a>' + 
 
\t \t \t '</div>'; 
 

 
\t \t return html; 
 
\t }; 
 

 
\t // Storing the consent in a cookie 
 
\t var setUserAcceptsCookies = function(consent) { 
 
\t \t var d = new Date(); 
 
\t \t var expiresInDays = _self.params.agreementExpiresInDays * 24 * 60 * 60 * 1000; 
 
\t \t d.setTime(d.getTime() + expiresInDays); 
 
\t \t var expires = "expires=" + d.toGMTString(); 
 
\t \t document.cookie = _self.vars.COOKIE_NAME + '=' + consent + "; " + expires + ";path=/"; 
 

 
\t \t $(document).trigger("user_cookie_consent_changed", {'consent' : consent}); 
 
\t }; 
 

 
\t // Let's see if we have a consent cookie already 
 
\t var userAlreadyAcceptedCookies = function() { 
 
\t \t var userAcceptedCookies = false; 
 
\t \t var cookies = document.cookie.split(";"); 
 
\t \t for (var i = 0; i < cookies.length; i++) { 
 
\t \t \t var c = cookies[i].trim(); 
 
\t \t \t if (c.indexOf(_self.vars.COOKIE_NAME) == 0) { 
 
\t \t \t \t userAcceptedCookies = c.substring(_self.vars.COOKIE_NAME.length + 1, c.length); 
 
\t \t \t } 
 
\t \t } 
 

 
\t \t return userAcceptedCookies; 
 
\t }; 
 
\t 
 
\t var hideContainer = function() { 
 
\t \t // $('.eupopup-container').slideUp(200); 
 
\t \t $('.eupopup-container').animate({ 
 
\t \t \t opacity: 0, 
 
\t \t \t height: 0 
 
\t \t }, 200, function() { 
 
\t \t \t $('.eupopup-container').hide(0); 
 
\t \t }); 
 
\t }; 
 

 
\t /////////////////////////////////////////////////////////////////////////////////////////////// 
 
\t // PUBLIC FUNCTIONS ////////////////////////////////////////////////////////////////////////// 
 
\t var publicfunc = { 
 

 
\t \t // INITIALIZE EU COOKIE LAW POPUP ///////////////////////////////////////////////////////// 
 
\t \t init : function(settings) { 
 

 
\t \t \t parseParameters(
 
\t \t \t \t $(".eupopup").first(), 
 
\t \t \t \t $(".eupopup-markup").html(), 
 
\t \t \t \t settings); 
 

 
\t \t \t // No need to display this if user already accepted the policy 
 
\t \t \t if (userAlreadyAcceptedCookies()) { 
 
\t \t \t \t return; 
 
\t \t \t } 
 

 
\t \t \t // We should initialise only once 
 
\t \t \t if (_self.vars.INITIALISED) { 
 
\t \t \t \t return; 
 
\t \t \t } 
 
\t \t \t _self.vars.INITIALISED = true; 
 

 
\t \t \t // Markup and event listeners >>> 
 
\t \t \t _self.vars.HTML_MARKUP = createHtmlMarkup(); 
 

 
\t \t \t if ($('.eupopup-block').length > 0) { 
 
\t \t \t \t $('.eupopup-block').append(_self.vars.HTML_MARKUP); 
 
\t \t \t } else { 
 
\t \t \t \t $('BODY').append(_self.vars.HTML_MARKUP); 
 
\t \t \t } 
 

 
\t \t \t $('.eupopup-button_1').click(function() { 
 
\t \t \t \t setUserAcceptsCookies(true); 
 
\t \t \t \t hideContainer(); 
 
\t \t \t \t return false; 
 
\t \t \t }); 
 
\t \t \t $('.eupopup-closebutton').click(function() { 
 
\t \t \t \t setUserAcceptsCookies(true); 
 
\t \t \t \t hideContainer(); 
 
\t \t \t \t return false; 
 
\t \t \t }); 
 
\t \t \t // ^^^ Markup and event listeners 
 

 
\t \t \t // Ready to start! 
 
\t \t \t $('.eupopup-container').show(); 
 

 
\t \t \t // In case it's alright to just display the message once 
 
\t \t \t if (_self.params.autoAcceptCookiePolicy) { 
 
\t \t \t \t setUserAcceptsCookies(true); 
 
\t \t \t } 
 

 
\t \t } 
 

 
\t }; 
 

 
\t return publicfunc; 
 
}); 
 

 
$(document).ready(function() { 
 
\t if ($(".eupopup").length > 0) { 
 
\t \t (new EuCookieLawPopup()).init({ 
 
\t \t \t 'info' : 'YOU_CAN_ADD_MORE_SETTINGS_HERE', 
 
\t \t \t 'popupTitle' : 'This site uses cookies to store information on your computer', 
 
\t \t \t 'popupText' : '', 
 
\t \t \t 'buttonLearnmoreTitle' : '' 
 
\t \t }); 
 
\t } 
 
}); 
 

 
}(jQuery));
.eupopup-container { 
 
    position: relative; 
 
    z-index: 190; 
 
    top: 0; 
 
    width: 100%; 
 
    height: 64px; 
 
    background: #4a4a4a; 
 
    text-align: center; 
 
    padding-top: 5px; 
 
    display: block; 
 
} 
 

 
.nav { 
 
    position:fixed; 
 
    top:0; 
 
    margin-top: 64px; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    
 
    <div class="nav"> 
 
    
 
    <img src="http://placehold.it/1200x300"> 
 
    
 
    </div> 
 
    
 
</div>

+0

你有編輯jsfiddle,因爲現在沒有任何學習更多的鏈接? –

回答

1
$('.eupopup-button_1').click(function() { 
    setUserAcceptsCookies(true); 
    hideContainer(); 
    return false; 
}); 

返回FALSE;應該是原因,請刪除它。

+0

非常感謝 - 很快會接受:) – michaelmcgurk

+1

感謝@ michaelmcgurk接受我的回答,我很高興它使您的工作 –

2

你需要做兩件事情

1)註釋掉行號228

$('.eupopup-button_1').click(function() { 
    setUserAcceptsCookies(true); 
    hideContainer(); 
    //return false; 
}); 

2)確保您都指向鏈接中沒有X-框架選項,否則將其設置就像是現在給會給出錯誤

拒絕在該框架中顯示 「https://www.google.co.in/?gfe_rd=cr&ei=Gb9nVtCHHu_I8AeltLGYBQ&gws_rd=ssl」 因爲它設置「X-框架 - 選項」來'SAMEORIGIN'。

+0

許多感謝這個詳細的回覆。 – michaelmcgurk