如何使用html自定義或採用jquery.wordexport.js第三方插件以word格式導出

時間 2019-12-24

標籤如何使用 html 自定義採用 jquery.wordexport.js jquery wordexport 第三方插件 word 格式導出欄目 HTML 简体版

原文原文鏈接

First method :user-definedjavascript

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>導出word文檔</title>
</head>
<body>
<%
   String exportToDoc = request.getParameter("exportToDoc");
   String fileName = request.getParameter("fileName")==""?"doc":request.getParameter("fileName");
   if (exportToDoc != null
         && exportToDoc.toString().equalsIgnoreCase("YES")) {
      //設置內容和頭文件爲word形式
      response.setContentType("application/msword");
      response.setHeader("Content-Disposition","inline; filename="+fileName+".doc");
   }
%>
   <div class="container">
  <p align="center" style="font-size: 36px;font-family:'微軟雅黑'">this is my first word folder</p>
   <div class="row">
      <div class="col-md-6" id="word_demo">
         <h3>谷歌Chrome56正式將HTTP頁面標記「不安全」</h3>          
         <p>9月8日谷歌宣佈，從2017年1月（Chrome56）開始，正式將某些HTTP頁面標記「不安全」，好比含密碼或信用卡信息傳輸的HTTP頁面，而將來的長期計劃是將全部HTTP頁面都標爲不安全，目的是讓用戶更加安全的瀏覽站點。 </p>
         <p>谷歌Chrome目前對HTTP的標記還比較中性，不能很好的反映HTTP的安全性缺失，谷歌的計劃是將HTTP頁面的不安全性更加清晰準確地標記出來，而這項計劃將分階段實施。 </p>
         <p>2017年開始，Chrome56將把含密碼或信用卡信息傳輸的HTTP頁面標記「不安全」，由於它們特殊的敏感性。然後續版本中，谷歌將把HTTP警告進一步延伸，好比更加註重隱私的無痕瀏覽模式下，將全部HTTP頁面標記「不安全」。最終目標是，將全部狀況下的HTTP頁面都標記爲「不安全」並以紅色三角形做爲警告標識，就像給失效的HTTPS鏈接的標識同樣。</p>
         <p><img src="../static/images/14733867979972.png" width="550" /></p>
         <p>谷歌將在將來的版本中按此計劃更新發布，可是建議網站儘快從HTTP轉換成HTTPS。HTTPS已經比以往任什麼時候候都更加容易實施，價格也更加便宜了。網絡的性能和最新功能對HTTP將更加敏感。瞭解谷歌的指南，開始入手創建HTTPS加密。</p>
         <p>來源：<a href="http://hoohtml.com/">優碼網</a></p>
         <a class="btn btn-default jquery-word-export" href="javascript:void(0)">
               <span class="word-icon">W</span>
               導出爲.doc文檔
             </a>
      </div>
   </div>
      <%if (exportToDoc == null) {%>
      <p>
      <form action="" method="post">
         <input type="hidden" name="exportToDoc" value="YES">
         <!-- 自定義文件名，沒有則默認doc.doc -->
         請輸入你要保存爲word文檔的文件名<input type="text" name="fileName" placeholder="如:doc">
         <input type="submit" value="Export to Doc">
      </form>
      </p>
      <%}%>
</div>
</body>
</html>

缺點：圖片不能保存html

Second method :jquery.wordexport.js plug-injava

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>導出word文檔插件</title>
</head>
<body>
   <div class="container">
  <p align="center" style="font-size: 36px;font-family:'微軟雅黑'">this is my first word folder</p>
   <div class="row">
      <div class="col-md-6" id="word_demo">
         <h3>谷歌Chrome56正式將HTTP頁面標記「不安全」</h3>          
         <p>9月8日谷歌宣佈，從2017年1月（Chrome56）開始，正式將某些HTTP頁面標記「不安全」，好比含密碼或信用卡信息傳輸的HTTP頁面，而將來的長期計劃是將全部HTTP頁面都標爲不安全，目的是讓用戶更加安全的瀏覽站點。 </p>
         <p>谷歌Chrome目前對HTTP的標記還比較中性，不能很好的反映HTTP的安全性缺失，谷歌的計劃是將HTTP頁面的不安全性更加清晰準確地標記出來，而這項計劃將分階段實施。 </p>
         <p>2017年開始，Chrome56將把含密碼或信用卡信息傳輸的HTTP頁面標記「不安全」，由於它們特殊的敏感性。然後續版本中，谷歌將把HTTP警告進一步延伸，好比更加註重隱私的無痕瀏覽模式下，將全部HTTP頁面標記「不安全」。最終目標是，將全部狀況下的HTTP頁面都標記爲「不安全」並以紅色三角形做爲警告標識，就像給失效的HTTPS鏈接的標識同樣。</p>
         <p><img src="../static/images/14733867979972.png" width="550" /></p>
         <p>谷歌將在將來的版本中按此計劃更新發布，可是建議網站儘快從HTTP轉換成HTTPS。HTTPS已經比以往任什麼時候候都更加容易實施，價格也更加便宜了。網絡的性能和最新功能對HTTP將更加敏感。瞭解谷歌的指南，開始入手創建HTTPS加密。</p>
         <p>來源：<a href="http://hoohtml.com/">優碼網</a></p>
         <a class="btn btn-default jquery-word-export" href="javascript:void(0)">
               <span class="word-icon">W</span>
               導出爲.doc文檔
             </a>
      </div>
   </div>
</div>
<script src="http://apps.bdimg.com/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="../static/js/FileSaver.js"></script>
<script type="text/javascript" src="../static/js/jquery.wordexport.js"></script>
<script type="text/javascript">    
$('.jquery-word-export').click(function(){
   //文件名
   var fileName="JWE";
  $("#word_demo").wordExport(fileName);
});
</script>
</body>
</html>

下載相關插件網址:http://hoohtml.com/jQuery/Tools/2016090927.htmljquery

注：在自定義的狀況下，無論以哪一種格式下載，不知大家有沒有發現都須要最關鍵的兩步：安全

response.setContentType("application/vnd.ms-excel"); //設置內容類型
response.setHeader("Content-Disposition","inline; filename="+fileName+".xls"); //設置頭文件

像我上篇所講的以jsp轉換爲excel格式也不例外：http://www.javashuo.com/article/p-wisgmxoc-mg.html網絡

So設置格式類型大全請參照：https://wenku.baidu.com/view/6eda456727d3240c8447efb7.htmlapp

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。