В этой статье в основном представлены соответствующие знания о том, как реализовать предварительный просмотр печати и сохранение контента веб -страницы. Давайте учимся вместе!
1. Проблемы о печати веб -страниц
Перед этим я обычно использовал более легкий в использовании LODOP для выполнения операций печати. Это было покрыто многими статьями в моих предыдущих статьях. Этот элемент управления является управлением ActiveX. После загрузки и установки вы можете распечатать на странице. Это также очень удобный контроль. Поэтому он очень подходит для печати обычного контента, наборов документов и других операций.
Однако с обновлением технологии браузера этот плагин, по-видимому, не поддерживается на Chrome или Firefox и в основном отказывается от метода обработки этого плагина. Например, если мне нужно распечатать содержимое в диалоговом окне на странице, как показано ниже.
Если вы обработаете его обычным способом использования LODOP, вы получите подсказку от браузера Chrome, и это сообщение об ошибке будет продолжаться независимо от того, загружаете ли вы или обновляете управление LODOP.
Для альтернативных методов это тема этой статьи. Мне всегда нравилось находить некоторые лучшие способы реализации необходимых мне функций, поэтому я нашел плагин PrintThis (https://github.com/jasonday/printthis) и jquery-print-preview-plugin (https://github.com/etimbo/jquery-preview-plugin). По сравнению с этими двумя, я предпочитаю простое и удобное использование первого.
2. Использование печатного плагина печати
С приведенной выше проблемой мы вводим новый метод печати, то есть подключаемость JQuery для реализации операции печати нуждающегося в нам контента страницы.
Использование этого плагина очень просто и удобно. Во -первых, вам нужно представить соответствующий файл JS на страницу, как показано ниже.
<script src = "~/content/jQueryTools/printThis/printThis.js"> </script>
Мы добавим две кнопки в верхней части страницы, такие как операции печати и экспорта, код заключается в следующем
<div> <a href = "#" onclick = "javascript: preview ();"> <img src = "~/content/images/print.gif"/> <br/> print preview </a> <a href = "#" onclick = "javascript: saveas ();"> <img src = "~/content/content/saveas.gif. как </a> </div>
Затем нам также необходимо объявить Div для размещения отображаемого контента веб -страницы, что удобно для печати.
Код обработки, который мы печатаем, также очень прост, просто распечатайте слой напрямую. Вы можете видеть, что приведенный ниже код использования очень прост.
// Печать предварительного просмотра Preview () {$ ("#printContent"). PrintThis ({Debug: false, importcss: true, importStyle: true, printContainer: true, load FormValues: true}); };После выполнения печати в IE и Chrome появятся диалоговое окно предварительного просмотра печати, чтобы подтвердить, печатать ли печатать.
3. Сохранить контент страницы
Иногда, чтобы облегчить бизнес -обработку, мы, как правило, можем предоставить пользователям операцию по экспорту печатного контента. Код, показанный ниже, предназначен для экспорта печатного контента в Word для пользователей для обработки и других целей.
function saveas () {var id = $ ('#id2'). val (); window.open ('/information/exportwordbyid? id =' + id); }Приведенная выше операция в основном вызывает метод контроллера MVC для обработки, передайте идентификатор для извлечения контента, а затем генерируйте требуемое содержимое слова.
На заднем плане мы в основном используем элемент управления apose.word для создания шаблонных документов.
Мы можем определить или просмотреть некоторую информацию о закладке в закладке, как показано на рисунке ниже.
Таким образом, мы можем получить информацию и указать этот шаблон слова в коде.
InformationInfo Info = bllFactory <manformation> .instance.findbyid (id); if (info! = null) {string template = "~/content/template/scale scale poard.doc"; String Templatefile = server.mappath (шаблон); Aspose.words.document doc = new aspose.words.document (templatefile);Содержание шаблона слова можно заменить с помощью текста, как показано ниже.
SetBookmark (Ref Doc, «Контент», info.content);
Вы также можете использовать метод закладки закладки для запроса и заменить его, как показано в следующем коде.
Aspose.words.bookmark bookmark = doc.range.bookmarks [title]; if (boopmark! = null) {bookmark.text = value; }Это требует особого лечения для основного контента HTML. Как правило, необходимо писать контент, используя выделенный метод вставки HTML, в противном случае будет отображаться код HTML. Контент, написанный с использованием выделенного метода HTML, в основном ничем не отличается от того, что мы видим на веб -странице. Как показано в следующем коде.
DocumentBuilder Builder = New DocumentBuilder (DOC); Aspose.words.bookmark bookmark = doc.range.bookmarks ["content"]; if (закладка! = 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 <manformation> .instance.findbyid (id); if (info! = null) {string template = "~/content/template/scale scale poard.doc"; String Templatefile = server.mappath (шаблон); 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, «Редактор», Info.editor); SetBookmark (Ref Doc, "Edittime", info.edittime.tostring ()); SetBookmark (Ref Doc, «подтип», info.subtype); // SetBookmark (Ref Doc, «Контент», info.content); // Для HTML -контента вам необходимо написать DocumentBuilder Builder = New DocumentBuilder (DOC); Aspose.words.bookmark bookmark = doc.range.bookmarks ["content"]; if (закладка! = 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 = controlercontext.httpcontext.response; response.flush (); response.end (); вернуть новый FileStreamResult (response.OutputStream, "Application/MS-Word"); } return null; } private void SetBookmark (ref aspose.words.document doc, строка название, строковое значение) {aspose.words.bookmark bookmark = doc.range.bookmarks [title]; if (boopmark! = null) {bookmark.text = value; }}Окончательный экспортируемый документ Word - это шаблон конкретного содержимого документа, а интерфейс предварительного просмотра Word показан ниже.
Выше приведено краткое изложение опыта метода Metronic разработки Bootstrap, основанной на Metronic Bootstrap, представленной вам [9] для реализации предварительного просмотра печати и сохранения контента веб -страницы. Я надеюсь, что это будет полезно для всех. Если вы хотите узнать больше информации, обратите внимание на веб -сайт wulin.com!