将网页中选定的一组 div 导出为 PDF 或 Word

Question

以下可能吗？给定一个网页，其中包含一组具有特殊 id 或类的 div，在这个 div 中，有一个标题（h1？）和一段标记，显示一个 div 标题的选择列表，带有复选框和一个按钮以选择全部，导出将选定的 div 转换为 PDF 或 Word。

示例标记：

:
<div class="selectable-and-exportable">
  <h1>Chapter One</h1>
  <p>Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
</div>
<div class="selectable-and-exportable">
  <h1>Chapter Two</h1>
  <p>Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
</div>
:

点击导出按钮时会出现一个灯箱或“页面内”弹出窗口：

<Select all>

[X] Chapter One
[X] Chapter Two

<Export to Word> <Export to PDF>

Answer 1

编辑：我想我现在更好地理解了这个问题。您问的是如何识别和呈现 HTML 文档的片段，而不是如何构建 PDF/Word 文件。

假设您使用的是 jquery 和 jquery-ui-dialog 插件，您可能会在对话框的 open 方法中尝试这样的操作：

var jOptions; // this should be a reference to the element in the dialog body where you want to insert the various headings
jQuery('.selectable-and-exportable').find('h1').each(function(){
    var jThis = jQuery(this);
    jOptions.append('<input type="checkbox" name="sections" value="' + jThis.attr('id') + '" /> ' + jThis.text() + '<br />');

});

您需要为弹出窗口的成功方法编写一些代码，以根据复选框集实际捕获所需的标记（您不应将该标记填充到复选框value 属性中）。