Mr.*_*Mr. 9 html xhtml jquery dom fancybox
我正在使用最新的fancybox(2.0.4),我为iframe创建了一个fancybox.内容显示正确.我在我的html中添加一个"关闭"按钮,该按钮在iframe中显示.我希望关闭按钮与点击fancybox右上角的"x"具有相同的结果.我熟悉FancyBox iframe返回parent.$ as undefined(使用WordPress),而我parent是一个没有任何内容的DOM对象.也试过了
window.parent.jQuery.fancybox.close();
window.parent.jQuery.fn.fancybox.close();
parent.jQuery.fn.fancybox.close();
parent.jQuery.fancybox.close();
任何帮助？
更新:
$(document).ready(function() {
$(".fancybox").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
type : 'iframe',
openEffect : 'none',
closeEffect : 'none',
afterClose : function() {
window.location.reload();
}
});
});
<a class="fancybox fancybox.iframe" id="newLink" href="new.html">link</a>
我怎么能有一个new.html关闭fancybox iframe窗口的按钮
更新:一个完整的HTML文件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" href="fancybox/jquery.fancybox.css?v=2.0.4" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/jquery.fancybox.pack.js?v=2.0.4"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox({
maxWidth : 800,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
type : 'iframe',
openEffect : 'none',
closeEffect : 'none',
afterClose : function() {
window.location.reload();
}
});
});
</script>
</head>
<body>
<a class="fancybox fancybox.iframe" id="newLink" href="b.html">link</a>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" href="fancybox/jquery.fancybox.css?v=2.0.4" type="text/css" media="screen" />
<script type="text/javascript" src="fancybox/jquery.fancybox.pack.js?v=2.0.4"></script>
</head>
<body>
<input type="submit" value="Cancel" id="cancelBtn" onclick="parent.jQuery.fancybox.close()"/>
</body>
</html>
JFK*_*JFK 31
您的手动关闭按钮应如下所示:
<a href="javascript:parent.jQuery.fancybox.close();"><img src="myCloseButton.png" alt="close fancybox" /></a>
UPDATE:你应该使用onsubmit的<form>标签,而不是对button图像所以在你的"new.html"设置类似
<form id="login_form" action="process.php" onsubmit="javascript:parent.jQuery.fancybox.close();">
更新#2:查看工作演示页面
更新#3:我已经决定删除我对这个答案的所有额外评论,因为讨论变得太长并且没有把我们带走.如果这可以帮助其他人,我会让代码和工作演示的链接.