Bagaimana untuk Mengekalkan Penggayaan CSS Apabila Menyimpan Unsur Pra Penyerlah Sintaks sebagai PDF?

Cara Menyimpan Pra Elemen Penyerlah Sintaks sebagai PDF Memelihara Penggayaan CSS

Untuk menyimpan pra elemen penyerlah sintaks sebagai PDF sementara mengekalkan CSS, pertimbangkan pendekatan alternatif ini:

Penyelesaian:

1. Buat Tetingkap Baharu: Buka tetingkap penyemak imbas baharu menggunakan tetingkap .open().
2. Tambah HTML dan CSS: Tambahkan kandungan HTML pra elemen ($("#output")[0].outerHTML) dan sebarang gaya CSS yang diperlukan ( $("style")[0].outerHTML) ke badan tetingkap baharu.
3. Fokus dan Cetak: Panggil .focus() dan .print() pada tetingkap baharu . Ini akan mencetuskan dialog cetakan sistem, membolehkan anda memilih "Cetak ke fail" untuk menyimpan pra elemen sebagai PDF.

Pelaksanaan jQuery:

<code class="javascript">$("#save").click(function() {
  var text = $("#output")[0].outerHTML;
  var styles = $("style")[0].outerHTML;
  var popup = window.open("", "popup");
  popup.document.body.innerHTML = text + styles;
  popup.focus();
  popup.print();
});</code>

Demonstrasi:

Anda boleh melihat penyelesaian ini dalam tindakan di jsfiddle berikut: http://jsfiddle.net/tn04Ldka/2/

Atas ialah kandungan terperinci Bagaimana untuk Mengekalkan Penggayaan CSS Apabila Menyimpan Unsur Pra Penyerlah Sintaks sebagai PDF?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!