使用jsPDF生成网页PDF时文本无法自动换行的解决方法咨询

我之前也踩过这个坑！fromHTML方法确实容易出现文本溢出不换行的情况，而且这个API已经被jsPDF标记为废弃了，更推荐使用官方现在主推的新方法来处理。给你几个可行的解决方案：

方案1：改用html()方法（推荐） #

html()是jsPDF替代fromHTML的新API，对HTML元素的排版支持更好，默认就能处理自动换行。只需要把你的代码改成下面这样：

function printPDF() {
  var doc = new jsPDF();
  var myDiv = document.getElementById("my-div");
  
  // 使用html()方法，通过配置参数控制排版
  doc.html(myDiv, {
    callback: function(doc) {
      doc.save('a4.pdf');
    },
    x: 10, // 左侧边距
    y: 10, // 顶部边距
    width: 190 // A4纸宽度为210mm，左右各留10mm边距，所以设置190mm宽度
  });
}

这里的width参数是关键，它会限制内容的宽度，让超出的文本自动换行到下一行。

方案2：如果坚持使用fromHTML（不推荐） #

如果你暂时不想换API，可以通过给fromHTML配置宽度参数，同时确保你的元素没有强制不换行的CSS样式：

function printPDF() {
  var doc = new jsPDF();
  var myDiv = document.getElementById("my-div");
  
  // 先给目标div设置最大宽度，避免网页样式影响
  myDiv.style.maxWidth = "190mm";
  
  // 在fromHTML的选项中设置width，触发自动换行
  doc.fromHTML(myDiv, 10, 10, {
    'width': 190
  });
  
  doc.save('a4.pdf');
}

注意：fromHTML已经不再维护，后续可能会出现更多兼容性问题，还是建议尽早切换到html()方法。

额外小提示 #

检查一下你的<p>标签有没有设置white-space: nowrap这类CSS样式，如果有的话，jsPDF会继承这个样式导致不换行，记得移除或者覆盖这个样式。

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