Drucken Sie ein Tabellen-Tag mit js

Question

Ich versuche, eine Tabelle zu drucken, aber sie erfasst die gesamte Seite. Im mobilen Modus möchte ich einfach die Adr-Tabellenklasse wie folgt drucken:

HTML

<table class="addr-table">

 ... table content...

</table>
<a href="#" class="js-print-link">Print</a>

JS

<script>

    $('.js-print-link').on('click', function() { var printBlock = $(this).parents('.addr-table').siblings('.addr-table');
      printBlock.hide();
      window.print();
      printBlock.show();
    });      
</script>

Ich habe viele Formate ausprobiert, einschließlich Vorschläge zu SO. Dieser Code hat die beste Leistung erbracht, jetzt das letzte Durcheinander. Wie kann ich nur die Tabelle im normalen PC-Modus erfassen, nicht im mobilen Modus?

Answer 1

Bitte versuchen Sie es ... es funktioniert richtig:

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <style>
    @media print {
         *{visibility:hidden}
         .printable,.printable *{
            visibility:visible
         }
      }
    </style>
</head>
<body>
    <div>
        this content is not printable
    </div>
    <table class="printable">
        <tr>
            <td>
                ... table content...
            </td>
        </tr>
    </table>
    <a href="#" class="js-print-link" onclick="print()">Print</a>
</body>
</html>