使用Ajax的jQuery FancyBox
我在Stackoverflow上看了很多网站和很多页面，但它们都没有解决我的问题。 简单地说，我有一个hyperlink ，我想通过Ajax调用从数据库中检索图像，然后在FancyBox弹出窗口中显示它。 我还尝试了许多不同的Javascript和Controller操作方法组合，但没有管理，因此正确显示下载的文件。 您能否看一下我的代码并提供一个包含View和Controller中所有必要方法的工作示例？ 另一方面，最好在打开图像文件的FancyBox时打开其他文件类型（即excel，pdf）的对话框。
视图：
@Model.FileName function downloadFile(id) { $.ajax({ url: "/Issue/RenderImage?ID=" + id, async: true, type: "POST", dataType: "json", contentType: "application/json; charset=utf-8", success: function (response) { $('#fancybox-inner').html('
'); } }); }
控制器：控制器中的方法没有问题，它可以正确返回图像。
[HttpPost] public virtual JsonResult RenderImage(int id) { string str = System.Convert.ToBase64String(repository.FileAttachments.FirstOrDefault(p => p.ID == id).FileData, 0, repository.FileAttachments.FirstOrDefault(p => p.ID == id).FileData.Length); return Json(new { Image = str, JsonRequestBehavior.AllowGet }); }
更好的尝试
success: function (response) { $.fancybox({ content: '', type: "html" }); }
我想知道为什么当你没有显示已经打开它的代码时，你试图在fancybox容器中加载内容。 无论如何，使用新内容（来自ajax响应）启动新的fancybox总是更好
当然，如果ajax调用为你的
这应该工作。 看起来图像存储为JSON。 如果是这样，我认为你应该在将它发送到浏览器之前将其转换回Base64。 见http://mobile.cs.fsu.edu/converting-images-to-json-objects/
function downloadFile(id) { $('#fancybox-inner').html('
'); }