亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
  • 首頁 > 
  • 教程 > 
  • 開發技術 > 
  • web開發 > 
  • 基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

發布時間:2020-04-07 20:43:30 來源:網絡 閱讀:515 作者:wuhuacong 欄目:web開發

在前面介紹了很多篇相關的《Bootstrap開發框架》的系列文章,這些內容基本上覆蓋到了我這個Bootstrap框架的各個主要方面的內容,總體來說基本達到了一個穩定的狀態,隨著時間的推移可以會引入一些更好更新的內容進行完善,本篇繼續這個系列,主要介紹如何實現Web頁面內容的打印預覽和保存操作。

1、Web頁面打印的問題

在此之前,我一般使用比較好用的LODOP來執行打印的操作,這個在我之前有很多文章都有涉及,這個控件是一個ActiveX的控件,需要下載安裝后就可以在頁面是進行打印的排版設計,預覽,打印等操作,還是很方便的一個控件,因此都很適合普通內容的打印,證件的套打等操作。

不過隨著瀏覽器技術的更新,這個插件在Chrome或者FireFox上好像不受支持了,基本上摒棄了這種插件的處理方式了。例如如果我在頁面上需要打印對話框里面的內容,如下所示。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

如果按正常使用LODOP的方式來進行處理的話,那么會得到Chrome瀏覽器的提示,并且這個不管你重新下載安裝、更新LODOP控件,都會繼續這個錯誤提示的。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

這個在一篇《Lodop頁面總提示"未安裝"或"請升級"的可能原因》,以及《Lodop用戶應對谷歌瀏覽器停用Plugin技術的處理辦法》都有說明,因此我們需要另辟蹊徑來處理這個頁面打印等的處理了。

對于替代方式,這里就是本篇內容介紹的主題了,我一直喜歡尋找一些比較好的方式的方式來實現自己需要的功能,于是找到了PrintThis的這個插件(https://github.com/jasonday/printThis)以及jquery-print-preview-plugin(https://github.com/etimbo/jquery-print-preview-plugin),對比兩者我比較喜歡第一個的簡潔方便的使用。

2、PrintThis打印插件的使用

有了上面的問題,我們引入一個新的打印方式,也就是JQuery插件來實現我們所需要頁面內容的打印操作。

這個插件的使用非常簡潔方便,首先需要在頁面里面引入對應的JS文件,如下所示。

<script src="~/Content/JQueryTools/printThis/printThis.js"></script>

我們再在頁面頂部增加兩個按鈕,如打印和導出操作,代碼如下所示

<div class="toolbar">
 <a href="#" onclick="javascript:Preview();"><img alt="打印預覽" src="~/Content/p_w_picpaths/print.gif" /><br />打印預覽</a>
 <a href="#" onclick="javascript:SaveAs();"><img alt="另存為" src="~/Content/p_w_picpaths/saveas.gif" /><br />另存為</a>         
</div>

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

然后我們還需要聲明一個DIV用來放置顯示的Web頁面內容,這樣也方便對它調用進行打印操作。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

我們打印的處理代碼也很簡單,就是直接對層進行打印處理就可以了,可以看到下面的使用代碼非常簡單。

//打印預覽
function Preview() {
	$("#printContent").printThis({
		debug: false,
		importCSS: true,
		importStyle: true,
		printContainer: true,
		loadCSS: "/Content/Themes/Default/style.css",
		pageTitle: "通知公告",
		removeInline: false,
		printDelay: 333,
		header: null,
		formValues: true
	});
};

打印執行后,IE和Chrome都會彈出一個打印預覽對話框,確認是否進行打印的操作。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

 

3、頁面內容的保存操作

有時候,為了方便業務處理,我們一般也可以提供給用戶一個導出打印內容的操作,如下所示代碼就是把打印的內容導出到Word里面給用戶加工等用途。

function SaveAs() {
	var id = $('#ID2').val();
	window.open('/Information/ExportWordById?id=' + id );
}

上面的操作,主要就是調用了MVC的控制器方法進行處理,傳入一個id就可以把內容提取出來,然后把它生成所需的Word內容即可。

這里后臺我們主要利用Apose.Word控件來進行模板化的文檔生成,具體可以參考一下我前面介紹過的使用方法文章《利用Aspose.Word控件實現Word文檔的操作》、《利用Aspose.Word控件和Aspose.Cell控件,實現Word文檔和Excel文檔的模板化導出》。

其中我們可以在書簽里面定義或者查看一些書簽的信息,如下圖所示。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作

這樣我們在代碼里面,就可以獲取信息并指定這個Word模板了。

            InformationInfo info = BLLFactory<Information>.Instance.FindByID(id);
            if (info != null)
            {
                string template = "~/Content/Template/政策法規模板.doc";
                string templateFile = Server.MapPath(template);
                Aspose.Words.Document doc = new Aspose.Words.Document(templateFile);

WORD模板的內容,可以使用文本替換方式,如下所示。

SetBookmark(ref doc, "Content", info.Content);

也可以使用書簽BookMark方式查詢替換,如下代碼所示。

Aspose.Words.Bookmark bookmark = doc.Range.Bookmarks[title];
if (bookmark != null)
{
	bookmark.Text = value;
}

對于主體的HTML內容,這需要特殊對待,一般需要使用插入HTML的專用方式進行寫入內容,否則就顯示HTML代碼了,使用專用HTML方法寫入的內容,和我們在網頁上看到的基本沒有什么差異了。如下代碼所示。

DocumentBuilder builder = new DocumentBuilder(doc);
Aspose.Words.Bookmark bookmark = doc.Range.Bookmarks["Content"];
if (bookmark != null)
{
	builder.MoveToBookmark(bookmark.Name);
	builder.InsertHtml(info.Content);
}

整個導入WORD文檔的方法就是利用這些內容的整合,實現一個標準文檔的生成,這種業務文檔是固定模板的,因此很適合在實際業務中使用,比起使用其他方式自動生成的HTML文件或者文檔,有更好的可塑性和美觀性。

整個代碼如下所示。

        public FileStreamResult ExportWordById(string id)
        {            if (string.IsNullOrEmpty(id)) return null;

            InformationInfo info = BLLFactory<Information>.Instance.FindByID(id);            if (info != null)
            {                string template = "~/Content/Template/政策法規模板.doc";                string templateFile = Server.MapPath(template);
                Aspose.Words.Document doc = new Aspose.Words.Document(templateFile);                #region 使用文本方式替換                //Dictionary<string, string> dictSource = new Dictionary<string, string>();                //dictSource.Add("Title", info.Title);                //dictSource.Add("Content", info.Content);                //dictSource.Add("Editor", info.Editor);                //dictSource.Add("EditTime", info.EditTime.ToString());                //dictSource.Add("SubType", info.SubType);  
                //foreach (string name in dictSource.Keys)                //{                //    doc.Range.Replace(name, dictSource[name], true, true);                //} 
                #endregion

                //使用書簽方式替換
                SetBookmark(ref doc, "Title", info.Title);
                SetBookmark(ref doc, "Editor", info.Editor);
                SetBookmark(ref doc, "EditTime", info.EditTime.ToString());
                SetBookmark(ref doc, "SubType", info.SubType);                
                //SetBookmark(ref doc, "Content", info.Content);                //對于HTML內容,需要通過InsertHtml方式進行寫入
                DocumentBuilder builder = new DocumentBuilder(doc);
                Aspose.Words.Bookmark bookmark = doc.Range.Bookmarks["Content"];                if (bookmark != null)
                {
                    builder.MoveToBookmark(bookmark.Name);
                    builder.InsertHtml(info.Content);
                }                
                
                doc.Save(System.Web.HttpContext.Current.Response, info.Title, Aspose.Words.ContentDisposition.Attachment,
                    Aspose.Words.Saving.SaveOptions.CreateSaveOptions(Aspose.Words.SaveFormat.Doc));

                HttpResponseBase response = ControllerContext.HttpContext.Response;
                response.Flush();
                response.End();                return new FileStreamResult(Response.OutputStream, "application/ms-word");
            }            return null;
        }        private void SetBookmark(ref Aspose.Words.Document doc, string title, string value)
        {
            Aspose.Words.Bookmark bookmark = doc.Range.Bookmarks[title];            if (bookmark != null)
            {
                bookmark.Text = value;
            }
        }

最后導出的WORD文檔就是模板化的具體文檔內容了,WORD預覽界面如下所示。

基于Metronic的Bootstrap開發框架經驗總結(9)--實現Web頁面內容的打印預覽和保存操作


向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

内丘县| 连城县| 阳谷县| 阿拉善左旗| 电白县| 昌吉市| 安宁市| 滨州市| 吕梁市| 内江市| 通化市| 澄城县| 牡丹江市| 斗六市| 鹤山市| 平湖市| 拉萨市| 潮安县| 沁水县| 许昌县| 山丹县| 桐庐县| 弥勒县| 怀仁县| 太仓市| 泰安市| 胶南市| 金乡县| 礼泉县| 仲巴县| 惠水县| 万盛区| 上饶县| 桦甸市| 嘉黎县| 云浮市| 额尔古纳市| 南通市| 武定县| 望都县| 建始县|