我试图做一个预览后，将出现在新的fancybox iframe中。 由于几个星期我在寻找一些帮助或最佳实践，但我不能找到它。
我的主要问题是从形式的fancybox窗口（更新数据库之前）来传递数据。 我的AJAX技术都很差，所以也许我的问题并不难。
请检查代码：
$('.preview2').fancybox({
fitToView : false,
width : 905,
height : 505,
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none',
ajax: {
type: "POST",
cache : false,
url: "preview.php",
data: $('#postp').serialize()
}
});
以及呼叫链接：
<a class="preview2" data-fancybox-type="iframe" href="preview.php" id="preview2">Preview</a>
我几乎可以肯定，一切都很好用preview.php文件，刚刚发布的变量和在适当的地方进行打印。
可有人检查的fancybox / AJAX的一部分？
正如我在我的评论中提到，你的预览按钮应该通过AJAX提交表单获得那个职位预览值（我们将使用ajax来代替iframe ）这样：
<a class="preview2" data-fancybox-type="ajax" href="preview.php" id="preview2">Preview</a>
然后，你将需要预览按钮绑定到一个手动on("click")方法提交的表单ajax其次首先....然后张贴在的fancybox的结果，如：
$(document).ready(function () {
$('.preview2').on("click", function (e) {
e.preventDefault(); // avoids calling preview.php
$.ajax({
type: "POST",
cache: false,
url: this.href, // preview.php
data: $("#postp").serializeArray(), // all form fields
success: function (data) {
// on success, post (preview) returned data in fancybox
$.fancybox(data, {
// fancybox API options
fitToView: false,
width: 905,
height: 505,
autoSize: false,
closeClick: false,
openEffect: 'none',
closeEffect: 'none'
}); // fancybox
} // success
}); // ajax
}); // on
}); // ready
见DEMO （随意浏览源代码）
我不喜欢的解决方案，所以我会后我自己的调查。
为什么写代码1 .on("click", ... 2 e.preventDefault 3. $.ajax 4 this.href只是为了呼吁成功的fancybox，已经有内部的所有功能，这 ？
如果您决定AJAX，而不是使用iframe的（如在接受的答案），你可以简单地添加type属性fancybox()调用，因为它是beening检查，并通过所有其他
$('.preview2').fancybox({
type: "ajax",
ajax: {
data: $('#postp').serialize()
// url: "someurl.php" not needed here, it's taken from href
// if you need it, e.g. you have a button, not a link
// use "href" property that overrides everything
// not attribute, cause it's invalid
}
// href: "url_to_add_or_override_existing_one",
// all other effects
// afterLoad: function () { // other cool stuff }
});
编辑作为@JFK指出这还不够，你有你点击链接，每次得到的表单数据，所以beforeLoad()所需要的，而不是data 。 Finnaly：
$('.preview2').fancybox({
type: "ajax",
beforeLoad: function() {
this.ajax.data = $('#postp').serialize();
}
});
您可以删除所有data-* atrributes太
小提琴
吻
我曾试图用的fancybox一个更有趣的方式工作，
在页面的fancybox
var myvar;
$(document).ready(function(){
myvar = parent.$("#formvariwant").val();
});
