jQuery wordexport导出 word

同事给我说了简单的导出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路径后可以直接使用。。

 

posted @ 2018-02-24 15:16  需要鼓励的博客猿  阅读(5831)  评论(0编辑  收藏  举报