Question

Hi StackOverflow社区，

我正在尝试在Confluence 6.10.2（使用JQuery 1.7.2）中生成一个文档生成器，并为用户提供各种选项。

用户可以选中复选框或单选按钮，以隐藏/显示通过HTML包含的其他页面

一旦选择了文档/选项，用户就可以导出到Word。

第一个问题是Confluence附带的“导出到Word”选项会导出所有内容（包括生成器和通常根据用户选择隐藏的所有部分...）。

因此，我创建了一个仅包含用户选择的元素的弹出窗口，然后添加了一个“导出到Word”按钮，该按钮使用jquery.wordexport.js作为附加库。

第二个问题是没有传递CSS样式（在该js中仍然// TODO）。由于我使用CSS counter-reset / counter-increment来具有正确的标头增量，因此没有传递CSS会破坏这一点。

我曾尝试将整个jquery.wordexport.js导出脚本手动写入HTML并对CSS样式进行硬编码，但这也不起作用。

<script src="https://www.jqueryscript.net/demo/Export-Html-To-Word-Document-With-Images-Using-jQuery-Word-Export-Plugin/FileSaver.js"></script>
<script src="https://www.jqueryscript.net/demo/Export-Html-To-Word-Document-With-Images-Using-jQuery-Word-Export-Plugin/jquery.wordexport.js"></script>

...
    // Open popup
    $("button#submit").click(function(){
        var htmlContent = $( "#schedMaster" ).html();
        $( "#schedulesDiv" ).html(htmlContent);
        $( "#schedulesDiv" ).find(".noprint").remove();
        //$( "#schedulesDiv table, #schedulesDiv td" ).css("border", "1px solid black");
        $( "#schedulePopup" ).show();
    });

    $("button#exportWord").click(function(event){
        $("#schedulesDiv").wordExport();
    });

});
</script>

<div id="schedulesOverlay" style="display: none;" tabindex="0" class="aui-blanket"></div>
<div style="margin-top: -265px; margin-left: -433px; width: 1065px; height: 530px; z-index: 3004; display: none;" id="schedulePopup" class="aui-popup aui-dialog">
    <h2 class="dialog-title">Schedules</h2>
    <div class="dialog-page-body">
        <div style="height: 413px; padding: 20px;" class="dialog-panel-body">
            <div id="schedulesDiv">...</div>
        </div>
        <div class="dialog-button-panel">
            <button id="exportWord">Export to Word</button> <button id="close">Close</button>
        </div>
    </div>
</div>

注意：如果我删除FileSaver.js和jquery.wordexport.js，则“导出到Word”按钮仍会生成一个文件...不知道为什么，但是想知道Atlassian JQuery实现是否不包含类似功能吗？

预先感谢您的帮助。

Answer 1

导出到Word时无法传递::: before之类的伪元素。

因此，相反，在导出到Word之前，我使用以下答案中的函数https://stackoverflow.com/a/5127570/11760815重新编写了具有字母/数字值的标题。

导出到Word融合内容会丢失CSS样式

1 个答案: