同事給我說了簡單的導出word的插件，親測了下，做個隨筆。
這個導出插件是jQuery自帶的的插件，通過調用wordexport.js來實現導出功能。
1.引入的js
<script type="text/javascript" src="/resources/jQuery/jquery.min.js"></script> <script type="text/javascript" src="/resources/FileSaver/FileSaver.js"></script> <script type="text/javascript" src="/resources/jQuery/jquery.wordexport.js"></script>
其中 wordexport.js 在 jquery.min.js 和 FileSaver.js 引用。
2.需要導出的數據
<a class="word-export" href="javascript:void(0)"> 導出word</a> <div id="page-content"> jquery 測試 </div>
注意 id="page-content" class="word-export" 要與 下面的 js 中的相對應。
3.jquery wordExport的使用方法
<script type="text/javascript"> jQuery(document).ready(function($) { $("a.word-export").click(function(event) { $("#page-content").wordExport(); }); }); </script>
4.導出文件的自定義名稱
<script type="text/javascript"> jQuery(document).ready(function($) { $("a.word-export").click(function(event) { $("#page-content").wordExport("導出文件的名稱"); }); }); </script>
在 wordExport("導出文件的名稱") 加入文件名稱就能自定義文件名稱
完整的代碼：
<body>
<a class="word-export" href="javascript:void(0)"> 導出word</a>
<div id="page-content">
jquery 測試
</div>
<script type="text/javascript" src="/resources/jQuery/jquery.min.js"></script>
<script type="text/javascript" src="/resources/FileSaver/FileSaver.js"></script>
<script type="text/javascript" src="/resources/jQuery/jquery.wordexport.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("a.word-export").click(function(event) {
$("#page-content").wordExport("測試");
});
});
</script>
</body>
更改js路徑后可以直接使用。。