Desconociendo la versión que usas de jsPDF, en las anteriores parece que necesitas también la librería html2canvas para que funcione.
Comenzando con los errores de tu código actual:
pdf.addHTML($("#pdf") ... );
El método .addHTML
necesita que el primer parámetro sea un elemento HTML o una cadena con el código correspondiente, pero $("#pdf")
devuelve una instancia de jQuery; en todo caso, se debe especificar el índice cero para devolver el primer elemento HTML que coincide con el selector: $("#pdf")[0]
El segundo parámetro debe ser solo la función a ejecutar cuando se genere el PDF o, en todo caso, para versiones más recientes, se debe proporcionar un objeto con las opciones, del tipo:
{
callback: function(instanciaJsPDF) { /* Código */ },
x: 15,
y: 15
}
Con versiones antiguas, esto debería funcionar
HTML:
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script>
<body>
<div id="pdf">
<p>Contenido del PDF</p>
</div>
</body>
Javascript:
document.addEventListener('DOMContentLoaded', function() {
let pdf = new jsPDF('p', 'pt', 'a4');
pdf.addHTML(document.querySelector('#pdf'), function() {
pdf.save('documentoPDF1.pdf');
});
});
Notas:
- Omití la librería jQuery, porque no es necesaria para este caso
- Puedes ver un ejemplo funcional en jsfiddle
- Para versiones más recientes, te recomiendo leer la documentación y adaptes el código a lo que requieres, quedando más o menos así:
document.addEventListener('DOMContentLoaded', function() {
let pdf = new jsPDF('p', 'pt', 'a4');
pdf.html(document.body, {
callback: function (pdf) {
pdf.save('documentoPDF1.pdf');
},
x: 10,
y: 10
});
});
<a>
puedes agregar el atributodownload