2013-07-29 5 views
0

Я начал использовать colorbox для jQuery, чтобы открыть всплывающее окно из родительского окна.Как закрыть окно colorbox с помощью всплывающего окна в jQuery

Теперь, что я пытаюсь сделать, предположим, что всплывающее окно открыто, и в этом всплывающем окне есть ссылка, и если я попытаюсь щелкнуть эту ссылку, она должна открыть эту ссылку в новом внешнем окне, а оригинал всплывающее окно должно закрываться.

Ниже мой родительский код окно, которое откроется всплывающее окно window-

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset='utf-8'/> 
     <title>Colorbox Examples</title> 
     <style> 
      body{font:12px/1.2 Verdana, sans-serif; padding:0 10px;} 
      a:link, a:visited{text-decoration:none; color:#416CE5; border-bottom:1px solid #416CE5;} 
      h2{font-size:13px; margin:15px 0 0 0;} 
     </style> 
     <link rel="stylesheet" href="C:\Users\rj\Downloads\colorbox-master\example4\colorbox.css" /> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script src="C:\Users\rj\Downloads\colorbox-master\jquery.colorbox.js"></script> 
     <script> 
      $(document).ready(function(){ 
       //Examples of how to assign the Colorbox event to elements 
       $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"}); 

      }); 
     </script> 
    </head> 
    <body> 
     <h2>Other Content Types</h2> 
     <p><a class='iframe' href="popup_window_url">Outside Webpage (Iframe)</a></p> 

     </body> 
</html> 

и ниже мой код всплывающего окна, которое будет иметь одну ссылку, что мне нужно, чтобы открыть в новом окне внешнего, закрыв оригинал всплывающее окно window-

<html> 
<head> 
    <title>Apply</title> 
</head> 
<body> 

<script> 
function getUrlParameters() { 
    var vars = {}; 
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, 
     function(m,key,value) { 
      vars[key] = value; 
     }); 
    return vars; 
} 
var id = getUrlParameters()["ID"];  
var title = getUrlParameters()["Title"];  
id = unescape(id); 
title = unescape(title); 

var myJScript = document.createElement('script'); 

myJScript.setAttribute('type', 'Apply'); 
myJScript.setAttribute('data-companyId', '40'); 
myJScript.setAttribute('data-jobTitle', id); 
myJScript.setAttribute('data-email', '[email protected]'); 

document.body.appendChild(myJScript); 
</script> 
<hr> 

<input name="Apply Online" type="button" id="Apply Online" value="Apply Online" ONCLICK="window.location.href='some_url'"> 

</body> 
</html> 

Теперь, как закрыть всплывающее окно, в этом случае после нажатия Применить Интернет кнопку ссылки и Применить Интернет ссылка должна получить откроется в новом окне внешнего? Надеюсь, этот вопрос должен быть достаточно ясным.

ответ

0

Используйте colorbox.close() на клике для ссылок внутри вашего colorbox div.

$("apply_online").click(function() { 
    colorbox.close(); 
    window.open('some_url'); 
}); 

BTW id не может иметь места ... так что это не так:

<input name="Apply Online" type="button" id="Apply Online" value="Apply Online" ONCLICK="window.location.href='some_url'"> 

должно быть:

<input name="Apply Online" type="button" id="apply_online" value="Apply Online" ONCLICK="window.location.href='some_url'"> 
+0

так apply_online это идентификатор здесь, и мне нужно заменить это с помощью приложения Online ..? И как только я нажму ссылку «Применить онлайн», он откроет новое внешнее окно? и colorbox будет близко .. Я прав? – AKIWEB

+0

Yup, apply_online должен быть идентификатором - пробелы не допускаются. Проверьте мой ответ, я обновил его. В основном, когда вы нажимаете на кнопку, вызовите функцию, чтобы закрыть colorbox, а затем откройте ссылку. – projeqht

+0

А также команда ONCLICK будет там в теге ввода здесь или нет? – AKIWEB

Смежные вопросы