Как напечатать один из двух разделов страницы в javascript

Question

У меня есть две секции на моей веб-странице, SectionA и SectionB (2 таблицы HTML).

Я хочу иметь возможность распечатать всю страницу, только SectionA или только SectionB.

У меня уже есть CSS-файл с media="print", и я использую window.print().

. Чтобы распечатать всю страницу, используйте кнопку / элемент меню печати браузера.

Для печати только SectionA:

function PrintSectionA()
{
    $('#SectionA').removeClass('hideFromPrint');
    $('#SectionB').addClass('hideFromPrint');
    window.print();
}

и наоборот для PrintSectionB() Да!это работает ... почти.Если я попытаюсь напечатать только SectionA, , тогда всю страницу, я получу только SectionA, потому что SectionB все еще имеет класс hideFromPrint.

Я бы хотел получить:

function PrintSectionA()
{
    $('#SectionA').removeClass('hideFromPrint');
    $('#SectionB').addClass('hideFromPrint');
    window.print();
    $('#SectionB').removeClass('hideFromPrint');
}

Но window.print(); возвращается до отправки документа на принтер.Так что PrintSectionA() на самом деле печатает все сейчас :(.

Есть ли способ заставить это работать?

Я думаю, что где-то видел, что я могу вызвать разрыв страницы в CSS, я мог бы спроситьпользователь печатает всю страницу, но выбирает только 1-ю или 2-ю страницу ... не так весело!

Answer 1

Как насчет определения трех функций (одна из которых «Печатать все»)?

function PrintSectionA()
{
    $('#SectionA').removeClass('hideFromPrint');
    $('#SectionB').addClass('hideFromPrint');
    window.print();
}

function PrintSectionB()
{
    $('#SectionB').removeClass('hideFromPrint');
    $('#SectionA').addClass('hideFromPrint');
    window.print();
}

function PrintAll()
{
    $('#SectionA').removeClass('hideFromPrint');
    $('#SectionB').removeClass('hideFromPrint');
    window.print();
}