使用jsPDF无法将数据库检索数据导出为PDF格式的问题咨询

你当前Excel导出正常但PDF生成失败，核心是三个显性问题：

• 引入的jsPDF为1.2.61远古版本，2016年发布的版本对中文支持、表格渲染、自动分页的兼容极差，直接写入结构化数据很容易出现空白页、内容截断、无报错但无文件生成的问题
• head区域重复加载了两个版本的jQuery（3.5.1、3.3.1），后加载的版本会覆盖全局$对象，容易导致绑定在全局的createPdf()方法执行上下文错乱
• 仅引入了jsPDF核心库，没有配套的表格排版插件，原生jsPDF仅支持逐行定位写入文本，没有自动适配列宽、自动分页、表格渲染的能力，直接写入多行列数据必然出问题

修复步骤 #

1. 清理冗余依赖，升级jsPDF版本 #

删除head中重复引入的3.3.1版本jQuery标签，将旧版jsPDF替换为本地存储的2.x稳定版本即可，不需要引用外部资源。

2. 补充表格渲染配套依赖 #

如果需要导出表格类数据，搭配jsPDF对应的自动表格插件使用，插件会自动处理列宽计算、跨页表头重复、内容换行、分页逻辑，不需要手动计算坐标位置。

3. 调整createPdf方法实现 #

直接复用你导出Excel时已经拿到的结构化数据源生成PDF，不要尝试直接抓取页面DOM转PDF，参考实现：

function createPdf() {
  // 初始化A4纵向PDF，单位使用毫米
  const doc = new jsPDF('p', 'mm', 'a4');
  // 直接复用导出Excel时的同一份数据源，无需重复请求数据库
  const reportData = 从数据库检索到的校验结果数据集;
  // 配置和页面表格一致的表头
  const tableHeader = [['序号', '校验项', '校验结果', '异常说明']];
  // 写入报告标题，居中放置
  doc.text('DMT数据校验报告', 105, 12, { align: 'center' });
  // 渲染表格内容
  doc.autoTable({
    head: tableHeader,
    body: reportData,
    startY: 20, // 标题下方开始渲染表格
    styles: {
      fontSize: 10,
      cellPadding: 2
    }
  });
  // 触发文件下载
  doc.save(`数据校验报告_${Date.now()}.pdf`);
}

提示：不要使用截图类方案导出数据类PDF，不仅清晰度差，文件体积是原生排版PDF的10倍以上，还无法选中复制内容，完全不适合数据报告场景。

4. 常见异常排查 #

• 若导出的PDF中文显示为乱码，将项目中使用的中文字体转换为jsPDF兼容格式后引入即可，jsPDF默认字体不支持中文字符
• 若点击按钮无反应，优先打开浏览器控制台查看报错，九成以上是依赖加载顺序错误：必须保证jsPDF、表格插件的script标签放在你自己的业务js（script.js）之前加载
• 若表格内容被页面边缘截断，要么调小字号，要么将PDF初始化为横向布局，或者给autoTable配置固定列宽即可

内容的提问来源于stack exchange，提问作者VIjay