✨ Helah mudah untuk mencetak div

Kelebihan

• Halaman anda mengekalkan interaktiviti selepas cetakan
• Bermain bagus dengan rangka kerja
• Tidak memerlukan pendua UI anda untuk cetakan

Langkah

1. Sembunyikan setiap kandungan halaman apabila dalam mod cetakan
2. Jadikan elemen sasaran anda kelihatan dalam mod cetakan

Langkah 1

@media print {
  body {
    visibility: hidden;
  }
}

Langkah 2

@media print {
  #section-to-print {
    top: 0;
    left: 0;
    position: absolute;
    visibility: visible;
  }
}

Kemudian cetak

const button = document.querySelector('print-page');

button.addEventListener('click', () => window.print());

---

Kaedah ini mengelakkan perangkap kehilangan interaktiviti, kaedah lain menggantikan keseluruhan kandungan halaman dengan HTML statik dengan itu kehilangan interaktiviti.

const printContents = document.getElementById(divId).innerHTML;
const originalContents = document.body.innerHTML;

document.body.innerHTML = printContents;

window.print();

document.body.innerHTML = originalContents;

Atas ialah kandungan terperinci ✨ Helah mudah untuk mencetak div. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!