Question

打印数值时我发现了一件奇怪的事情。 jQuery的（文件）。就绪（函数（）{ jQuery（＆＃39;＃print_btn＆＃39;）。on（＆＃39; click＆＃39;，function（）{ var divToPrint = document.getElementById（＆＃34; print_tbl＆＃34;）; newWin = window.open（＆＃34;＆＃34;）; newWin.document.write（divToPrint.outerHTML）; newWin.print（）; newWin.close（）; }）; }）; 看看这个小提琴如果单击“打印”，则会看到值为1。如果将值更改为2，然后再次单击“打印”，则值仍为1。如何获得打印图像以反映更改？

Answer 1

虽然epascarello的评论是最好的方法，但您可以通过将selected属性添加到与其父级selectedIndex成员对应的选项中来支持此方法。完成后，打印结果中将显示正确的选项。

这里有一些JS可以解决这个问题：

function byId(id,parent){return (parent == undefined ? document : parent).getElementById(id);}
function allByTag(tagName,parent){return (parent == undefined ? document : parent).getElementsByTagName(tagName);}

function forEachNode(nodeList, func){for (var i=0, n=nodeList.length; i<n; i++) func(nodeList[i], i, nodeList); }
// **** below function updated in an EDIT ****
function setListSelectedAttrib(selectElem)
{
    var selectedIndex = selectElem.selectedIndex;
    var i, n = selectElem.options.length;
    for (i=0;i<n;i++)
    {
         if (i == selectedIndex)
             selectElem.options[i].setAttribute('selected', '');
        else
             selectElem.options[i].removeAttribute('selected');
    }
}


function onPrintClicked(evt)
{
    var elemToPrint = byId('print_tbl');
    var selectElems = allByTag('select', elemToPrint);

    forEachNode(selectElems, eachSelElemFunc);
    function eachSelElemFunc(curElem, indexOfCurElem, listOfElems)
    {
        setListSelectedAttrib(curElem);
    }

    var newWin = window.open();
    newWin.document.write(elemToPrint.outerHTML);
    newWin.print();
    newWin.close(); 
}

请看这里的小提琴：https://jsfiddle.net/jpkz0fyp/1/

Answer 2

您可以尝试使用css媒体查询而不是javascript来确定打印的内容。您可以使用以下代码

开始

@media print {
    * {
        visibility : hidden;
    }
    .print {
        visibility : visible;
    }
}

http://jsfiddle.net/k2mtaob2/2/

请注意，在提供的示例中，只有 World 将打印在小提琴中

Answer 3

问题是你打印另一个窗口。这将打印当前窗口。

jQuery(document).ready(function(){
    jQuery('#print_btn').on('click', function() {
        window.print();
    });
});

如何在打印前获取<select>值进行更新？

3 个答案: