Bestimmen Sie, Ob Drucken/Abbrechen-Button in der Google Chrome-Print-Preview Geklickt wird

Ich habe Druck meine Seite mithilfe des folgenden Codes:

window.print();

Einen Bild unten sieht man, wie die seitenansicht in der Google-chrome-browser aussieht. Es hat zwei Haupt-Tasten: print und cancel.

Ich möchte wissen, ob der Benutzer geklickt hat, die print oder cancel Tasten. Was habe ich jquery verwendet:

HTML-Code der seitenansicht:

<button class="print default" i18n-content="printButton">Print</button>
<button class="cancel" i18n-content="cancel">Cancel</button>

Jquery-Code:

 $('button > .cancel').click(function (e) {                
      alert('Cancel');
 });

 $('button > .print').click(function (e) {                
      alert('Print');
 });

Habe ich versucht, den code oben mit kein Glück. Was bin ich?

Als eine Randnotiz, button > .cancel hätte nicht ausgewählt die Schaltfläche Abbrechen, aber ein element mit cancel Klasse in einer Schaltfläche. Den richtigen Selektor gewesen wäre button.cancel (aber das wird nicht funktionieren, jedenfalls)
Ich will auch wissen, über cross-browser-Lösung ist jede
U wollen, um was zu finden??? die hinter-Kodierung inside-print?

InformationsquelleAutor Eliyah | 2015-04-28

Können Sie nicht auf Chrome die interne windows (drucken-dialog in diesem Fall) direkt aus einer normalen web-Seite.

    (function () {

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

        var afterPrint = function () {
            alert('Functionality to run after printing');
        };

        if (window.matchMedia) {
            var mediaQueryList = window.matchMedia('print');

            mediaQueryList.addListener(function (mql) {
                //alert($(mediaQueryList).html());
                if (mql.matches) {
                    beforePrint();
                } else {
                    afterPrint();
                }
            });
        }

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

    }());

Oder, Wenn Sie wollen, etwas zu tun, wenn die Druckvorschau wird geöffnet, Sie können versuchen, unten:

$(document).bind("keyup keydown", function (e) {
         if (e.ctrlKey && e.keyCode == 80) {
             setTimeout(function () { CallAfterWindowLoad();}, 5000);
             return true;
         }
     });

    function CallAfterWindowLoad()
    {
        alert("Open and call");
    }

Referenz:
Wie erfassen Sie das click-Ereignis auf den Standard-drucken-Menü aufgerufen, indem Sie Javascript-Fenster.print()

Vielleicht, wenn Sie uns Ihre Anforderungen für diese zwei Schaltflächen klicken Sie auf Ereignis, können wir Ihnen eine Alternative Lösung.

InformationsquelleAutor Prashant Kankhara

4

es ist sehr leicht möglich:
```
<body onafterprint="myFunction()">
```
Die myFunction (), die Sie definieren können innerhalb eines Tags wird ausgelöst, wenn entweder der Auftrag erledigt oder die Abbrechen-Schaltfläche wurde gedrückt.

InformationsquelleAutor Madness
1

Soweit ich weiß, wird die Druck-Vorschau wird nicht Teil der document Ihre JS zugreifen können. Diese könnten Sie interessieren:

Erkennung von browser-drucken-Ereignis

ExtJS 4 - erkennen, wenn der Benutzer drückt "Drucken" auf drucken-dialog aufgerufen wurde programmatisch

InformationsquelleAutor ekuusela

Dies sollte den trick tun. Ich habe jQuery v2.2.0, die enthalten ist in der html-Datei.

$("#print").click(function() { //calls the id of the button that will print
    document.body.style.visibility = 'hidden'; //code for hiding the body
    document.getElementById('printthis').style.visibility = 'visible'; //div to be printed
    document.getElementById('printthis').style.position = 'absolute'; //some code/css for positioning. you can adjust this
    document.getElementById('printthis').style.top = '40px';
    document.getElementById('printthis').style.left = '0px';
    if (print()) { //shows print preview.

    } else { //else statement will check if cancel button is clicked.
        document.body.style.visibility = 'visible';
        document.getElementById('printthis').style.position = '';
        document.getElementById('printthis').style.top = '';
        document.getElementById('printthis').style.left = '';
        alert("Print Canceled");
    }
});

Ich denke, das könnte genauso gut verwendet werden, als eine Möglichkeit zum drucken bestimmte divs in den html-Code. Nur verstecken die body element und zeigen nur das div, die Sie drucken möchten, mit einigen css-Positionierung. Hoffe es klappt bei dir. Ich habe es ausprobiert und ich kann sagen, dass es für mich funktionierte.

InformationsquelleAutor JayBee Rosalinda

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.