如何在jQuery PrintArea中传递自定义html标记

Question

I use the Jquery function printarea to print a part of my page (some columns of a table).

If I place the selector class in the two columns I need to print, like this:

<tr>
  <td class="printarea">content1</td>
  <td class="printarea">content2</td>
  <td>content3</td>
</tr>    

The function will print each column in one row:

content 1 content 2

If I place the selector class to the tr instead, like this:

<tr class="printarea">

It prints every column in one single row:

content 1 content 2 content 3

What I need is to print the two first columns in one row:

content 1 content 2

Does anyone know how to achieve this?

Answer 1

First of all hide all the rows in the table then show only two columns in the row using :lt selector in jquery. it displays first two columns in the below context

$("table tr td").hide();
$("table tr td:lt(2)").show();

FIDDLE

Answer 2

This will work, Use Colgroups, don't need to use jquery, Is there a specific reason you want JS/Jquery ?

 .printable{background-color:red;} .notprintable{background-color:yellow;} @media print{ .notprintable{display:none} } 

 <table> <colgroup> <col span="2" class="printable"> <col class="notprintable"> </colgroup> <thead><tr><th>print 1 head</th><th>print 2 head</th><th>none print head</th></tr></thead><tbody><tr><td> print</td><td>print</td><td> no print</td></tr><tr><td> print</td><td>print</td><td> no print</td></tr><tr><td> print</td><td>print</td><td> no print</td></tr></tbody><tfoot><tr><td> print</td><td>print</td><td> no print</td></tr></tfoot></table>