jQuery 颜色框错误 - 从链接或按钮关闭颜色框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10406927/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
colorbox bug - close colorbox from a link or button
提问by Aximili
I open the popup by calling
我通过调用打开弹出窗口
$.colorbox({ href: "notification.aspx" });
In notification.aspx I have
在notification.aspx我有
<script type="text/javascript" src="/scripts/colorbox/jquery.colorbox-min.js"></script>
...
<a id="btnClose">OK</a>
The popup was shown fine, but when I click the button it gives a JavaScript error.
弹出窗口显示正常，但是当我单击按钮时，它给出了 JavaScript 错误。
In the main page's javascript I have
在主页的 javascript 我有
$('#btnClose').live('click', function () {
alert('closing...'); // Alert shown as expected
$.colorbox.close(); // Nothing happens, no JavaScript error
//$.fn.colorbox.close(); // same
//parent.$.fn.colorbox.close(); // same
//$.colorbox.remove(); // same
//$('#cboxClose').click(); // same
//$('#cboxOverlay').click(); // same
});
I am just trying to close the popup.
我只是想关闭弹出窗口。
What am I missing? Thanks in advance.
我错过了什么？提前致谢。
EDIT: I got it working somehow, I'll find out what made it works.
编辑：我让它以某种方式工作，我会找出是什么让它起作用。
回答by Hyman
$.colorbox.close()is the correct way to close colorbox, do not listen to these other comments. The problem is that you are loading colorbox a second time. Remove the jquery.colorbox.jsscript block from notification.aspx.
$.colorbox.close()是关闭colorbox的正确方法，不要听这些其他评论。问题是您第二次加载颜色框。删除jquery.colorbox.js从脚本块notification.aspx。
回答by Bruno Carvalho Silva Correa
Try
尝试
<a href='#' onclick='parent.$.colorbox.close(); return false;'>Close</a>
回答by coolguy
$(document).ready(function(){
$.colorbox({
inline:true,
href:'notification.aspx',
onClosed:function(){ alert('closing');
$.colorbox.remove();
}
});
});
回答by Aximili
Thank you everyone for your comments.
谢谢大家的意见。
This is really weird, but after fiddling around I found this does it
这真的很奇怪，但在摆弄之后我发现这样做了
$('#btnClose').live('click', function () {
$.colorbox.remove(); // You have to remove it first (don't know why)
$('#cboxClose').click(); // Then this will close the box, $.colorbox.close() still doesn't work
$.colorbox.init(); // Re-init, otherwise colorbox stops working
});
Hope it helps someone.
希望它可以帮助某人。
EDIT: Although that fixed the problem, the cause of the problem was I included jquery twice! (Thanks Hyman)
编辑：虽然这解决了问题，但问题的原因是我两次包含 jquery！（谢谢Hyman）
回答by Sthita
This may help someone .I have created a custom close button . My custom close button is coming on top right corner and can able to close also. My code :
这可能对某人有所帮助。我创建了一个自定义关闭按钮。我的自定义关闭按钮位于右上角，也可以关闭。我的代码：
jQuery(document).ready(function(){
jQuery('<div id="close" style="cursor: pointer; position: absolute; top: 0; right: 30px;"><img src="../img/close.png" alt="close"/></div>').appendTo('.yourparentDiv');
$("#close").click(function() {
jQuery('#cboxClose').click();
});
});
I was facing problem on closing the colorbox. It helped me.
我在关闭颜色框时遇到问题。它帮助了我。
回答by Awais Ahmed Khan
This helped me
这帮助了我
// 3. Handle the dialog cancel button:
// 3. 处理对话框取消按钮：
$("#CancelDeleteButton").click(function()
{
$.fn.colorbox.close();
return false;
});
回答by Mohanad Haddadin
most answers will work if you have the following conditions: 1. parent and child on the same domain 2. child has JQuery
如果您有以下条件，大多数答案都会起作用： 1. 父和子在同一个域中 2. 子有 JQuery
in case you want to close the child box and you have any of these two conditions do the following:
如果您想关闭子框并且您有这两个条件中的任何一个，请执行以下操作：
in the parent do this:
在父母中这样做：
$('document').ready(
function () {
window.addEventListener("message", function (event) {
$.colorbox.close();
});
});
in the child add a close button with the following js on click
在孩子中添加一个关闭按钮，点击以下js
<input type="button" value="close" onclick="parent.postMessage('child frame', '*');" />
回答by Control Freak
In notification.aspx you should have
在notification.aspx 你应该有
<a id="btnClose" href="javascript:closeBox();">OK</a>
In the main page's javascript you should have
在主页的 javascript 你应该有
<script type="text/javascript" src="/scripts/colorbox/jquery.colorbox-min.js"></script>
...
function closeBox() {
$.colorbox.close();
}
