如何使用jQuery中的弹出窗口关闭颜色框窗口

how to close the colorbox window using the popup window in jQuery

本文关键字:窗口 颜色 何使用 jQuery      更新时间:2023-09-26

我已经开始使用jQuery colorbox从父窗口打开弹出窗口。

现在我要做的是-假设一个弹出窗口打开,并且该弹出窗口中有一些链接,如果我尝试单击该链接,它应该在一个新的外部窗口中打开该链接,并且原始弹出窗口应该关闭。

下面是我的父窗口代码,它将打开弹出窗口-

<!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>

下面是我的弹出窗口代码,它将有一个链接,我需要通过关闭原始弹出窗口在新的外部窗口中打开-

<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', 'admin@domain.net');
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>

现在,在这种情况下,单击"应用在线链接"按钮后,如何关闭弹出窗口,应用在线链接应该在新的外部窗口中打开?我希望这个问题应该足够清楚。

点击colorbox.close()可在您的颜色框div中找到链接。

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

BTWid不能有空格。。。所以这是错误的:

<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'">