如何使用javascript打印页面的原始,重复和三份副本?

时间:2017-08-11 07:41:42

标签: javascript jquery html css

我有一个示例html页面,我只想打印此页面的三个副本,并且只有在我们获取此页面的第二个副本时才更改原始(在右上角提到)。无论如何,我们可以使用Javascript或Jquery来实现这一目标吗?



function myFunction() {
    window.print();
}

 .original  {
float : right;
margin-right : -0.1cm;
}

<p>Click the button to print the current page.</p>

<button onclick="myFunction()">Print this page</button>

<div class="col-xs-4"></div>
       <div class="col-xs-1 original"><font color="red"><strong>Original</strong></font></div>
       
       
     
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

我试图提供暂时保存打印计数标志的简单解决方案。请查看以下内容。

<h:form>
   <f:param name="parameter1" value="#{aUiController.parameter1}" />
   <f:param name="parameter2" value="#{aUiController.parameter2}" />
   <f:param name="parameter3" value="#{aUiController.parameter3}" />
   <p:commandButton action="#{aUiController.goToPageB()}" value="Go to Page B" />
</h:form>
var v1=0;
function myFunction() {
   if (v1==0) {
  window.print();
   }
   else {
  window.print();
  $('#s1').text('Duplicate');
   }
   v1++;
}
.original  {
float : right;
margin-right : -0.1cm;
}

希望这会对你有帮助!

答案 1 :(得分:0)

此处,示例代码。请立即检查。              

    #printable { display: none; }

    @media print
    {
        #non-printable { display: none; }
        #printable { display: block; }
    }
    </style>
</head>
<body>
    <div id="non-printable">
        Your normal page contents
    </div>
    <div id="printable">
        Printer version <div id="count"></div>
    </div>
    <a href="#" id="autoclick" onclick="window.print();">Print<a>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
(function() {

    var beforePrint = function() {
        console.log('Functionality to run before printing.');
    };

    var afterPrint = function() {
        console.log('Functionality to run after printing');
          var vals = $('#inc').val();
          var incval = parseInt(vals)+parseInt(1);
           $('#inc').val(incval);
           if(incval < 3)
           {   

              window.setTimeout('window.print()',5000); 
           }
    };

    if (window.matchMedia) {
        var mediaQueryList = window.matchMedia('print');
        mediaQueryList.addListener(function(mql) {
            if (mql.matches) {
                beforePrint();
            } else {
                afterPrint();
            }
        });
    }

    window.onbeforeprint = beforePrint;
    window.onafterprint = afterPrint;

}());
</script>
<input type="text" id="inc" value="0">