jQuery对话框小部件是否能够显示word文档(或PDF) - 即,而不是纯文本或HTML?
答案 0 :(得分:0)
仅供参考 - 这说明了(某种程度上)我想要完成的事情 - 对于那些面临同样问题/问题的人来说...... - 这是一个包含滚动PDF文档的弹出/对话框。
下面,我发布了一个正在做这个的工作示例的关键部分......
FWIW,我在互联网上找不到任何做这样做的例子...... - 如果有更好的方法来实现这一点 - 即没有第三方产品 - 请发布! : - )
(正如你所看到的那样,我不需要一款名为“Lightbox”的产品 - 有人有点谦逊地建议 - 这样做)
<!DOCTYPE html>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="x-ua-compatible" content="IE=8" />
<meta charset="UTF-8"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="0"/>
<title>jquerydialogpdf</title>
<link type="text/css" rel="stylesheet" href="css/jquery-ui-1.8.23.custom.css" />
<script type="text/javascript" src="js/jquery-1.8.0.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.23.custom.min.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
var context = "${pageContext.request.contextPath}";
function showAgreementDialog(url)
{
var okay_to_close_window = false; //i.e., force user to use buttons in modal dialog...
var tag = $("<div></div>");
$("<object style='height: 100% !important; width: 100% !important;' data='" + url + "' type='application/pdf'></object>").appendTo(tag);
tag.dialog(
{
closeOnEscape: false,
width: 640,
height: 480,
resizable: true,
autoOpen: false,
modal: true,
title: "<h2 style='padding-bottom: .8em; color: red;text-align: center !important;text-decoration:underline !important;'>AGREEMENT</h2><h3 style='color: blue;text-align: center !important;'>I have read and acknowledged the agreement.</h3><h4 style='color: black;text-align: center !important; font-weight: normal !important; font-style: italic !important; font-size: 8pt !important;'>(Use the buttons below to indicate agreement).</h3>",
buttons: [
{text: "I agree", click: function()
{
okay_to_close_window = true;
$("#testdialog").attr('checked', true);
$(this).dialog("close");
return false;
}
},
{text: "I do not agree", click: function()
{
okay_to_close_window = true;
$("#testdialog").attr('checked', false);
$(this).dialog("close");
return false;
}
}],
beforeclose: function() {
return okay_to_close_window;
}
}).dialog('open');
$('a.ui-dialog-titlebar-close').remove();
}
$(document).ready(function()
{
$("#testdialog").on("click", function(e)
{
if ($("#testdialog").is(":checked") === true)
{
showAgreementDialog("data/getAgreement");
}
else
{
$("#testdialog").attr('checked', false);
}
});
});
/* ]]> */
</script>
</head>
<body>
<input id="context" type="hidden" value="${pageContext.request.contextPath}"/>
<form>
<label for="testdialog">check to invoke agreement dialog</label>
<input id="testdialog" type="checkbox" name="testdialog" value="false"/>
</form>
</body>
</html>
package aaa.bbb.ccc.war;
import java.io.File;
import java.io.IOException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import javax.servlet.http.HttpServletResponse;
import org.springframework.context.annotation.Scope;
import javax.servlet.http.HttpSession;
import org.apache.commons.io.FileUtils;
@Controller
@Scope("session")
public class IndexController
{
@RequestMapping(value = "/getAgreement", method = RequestMethod.GET)
@ResponseBody
public void getAgreement(HttpServletResponse response, HttpServletRequest request, HttpSession session) throws IOException, Exception
{
byte[] bytes = FileUtils.readFileToByteArray(new File("C:\\agreement.pdf"));
ServletOutputStream stream = response.getOutputStream();
response.setContentType("application/pdf");
response.addHeader("Content-Type", "application/pdf");
response.addHeader("Content-Disposition", "inline;filename=agreement.pdf");
response.setContentLength((int) bytes.length);
stream.write(bytes);
stream.flush();
stream.close();
}
}