2016-04-26 3 views
1

У меня есть таблица, которая выглядит так: jsfiddle Теперь мне нужно реализовать функциональность для печати только выбранных строк. Строки можно выбрать, щелкнув флажок справа от каждой строки. Может кто-нибудь посоветует мне, как его завершить, пожалуйста?Печать выбранных строк из таблицы HTML

я уже реализована полная таблица функциональность печати с

var divToPrint=document.getElementById("pretazna"); 
    newWin= window.open(""); 
    newWin.document.write(divToPrint.outerHTML); 
    newWin.print(); 
    newWin.close(); 

ответ

0

Попробуйте этот код ... он не создает всплывающее окно, но вместо того, чтобы скрыть строки с помощью печати таблицы стилей (demo)

CSS

@media print { 
    #print, tfoot, tbody tr:not(.printme) { 
    display: none !important; 
    } 
} 

Javascript

function matches(el, selector) { 
    // https://developer.mozilla.org/en-US/docs/Web/API/Element/matches 
    var matches = document.querySelectorAll(selector), 
    i = matches.length; 
    while (--i >= 0 && matches.item(i) !== el) {} 
    return i > -1; 
} 

function closest(el, selector) { 
    while (el && !matches(el, selector)) { 
    el = el.parentNode; 
    } 
    return matches(el, selector) ? el : null; 
} 

document.querySelector('table').addEventListener('change', function(event) { 
    var target = event.target; 
    closest(target, 'tr').classList[target.checked ? 'add' : 'remove']('printme'); 
}) 

document.querySelector("#print").addEventListener('click', function() { 
    window.print(); 
}); 
Смежные вопросы