admin管理员组

文章数量:1297051

try {
    var a;
    var b = new jsPDF("p", "pt", "a3");
    var c = document.getElementById("leftPieCanvas").toDataURL("image/png");
    b.addImage(c, "PNG", 265, 60);
    a = document.getElementById("rightPieCanvas").toDataURL("image/png");
    b.addImage(a, "PNG", 205, 440);
    if ($("#sales_table").length) {
        var d = tableToJson($("#sales_table").get(0));
        b.setFont("helvetica");
        b.setFontType("bold");
        b.setFontSize(9);
        $.each(d, function(a, c) {
            $.each(c, function(c, d) {
                b.cell(40, 830, 55, 20, d, a);
            });
        });
    }
    b.output("dataurlnewwindow");
} catch (e) {
    alert(e);
}

Above code is working in firefox but not in chrome, i googled and got suggestions that use iframe so i have created iframe but unable to put this code in above code, anyone can suggest please that how do i add the below code into above code so i can render a PDF in google chrome also.

var html = '<html>' +
      '<style>html, body { padding: 0; margin: 0; } iframe { width: 100%; height: 100%; border: 0;}  </style>' +
      '<body>' +
      '<iframe src="' + url + '"></iframe>' +
      '</body></html>';
try {
    var a;
    var b = new jsPDF("p", "pt", "a3");
    var c = document.getElementById("leftPieCanvas").toDataURL("image/png");
    b.addImage(c, "PNG", 265, 60);
    a = document.getElementById("rightPieCanvas").toDataURL("image/png");
    b.addImage(a, "PNG", 205, 440);
    if ($("#sales_table").length) {
        var d = tableToJson($("#sales_table").get(0));
        b.setFont("helvetica");
        b.setFontType("bold");
        b.setFontSize(9);
        $.each(d, function(a, c) {
            $.each(c, function(c, d) {
                b.cell(40, 830, 55, 20, d, a);
            });
        });
    }
    b.output("dataurlnewwindow");
} catch (e) {
    alert(e);
}

Above code is working in firefox but not in chrome, i googled and got suggestions that use iframe so i have created iframe but unable to put this code in above code, anyone can suggest please that how do i add the below code into above code so i can render a PDF in google chrome also.

var html = '<html>' +
      '<style>html, body { padding: 0; margin: 0; } iframe { width: 100%; height: 100%; border: 0;}  </style>' +
      '<body>' +
      '<iframe src="' + url + '"></iframe>' +
      '</body></html>';
Share Improve this question asked Aug 12, 2017 at 10:19 KuldeeP ChoudharYKuldeeP ChoudharY 4282 gold badges7 silver badges23 bronze badges 3
  • Try looking on the documentation for examples maybe – user8395373 Commented Aug 14, 2017 at 8:21
  • Is this piece of JavaScript placed within <script> tags in your website? If so, what you should do is add the iFrame with the HTML earlier on, in the <head> then change the attributes and show and hide it later on. – user8395373 Commented Aug 14, 2017 at 8:24
  • Does this answer your question? JsPDF - Not allowed to navigate top frame to data URL – outis Commented Jul 7, 2022 at 20:49
Add a ment  | 

3 Answers 3

Reset to default 3

In pure javascript, maybe like this works:

html: <object id="obj" type="application/pdf"> </object>

js: document.getElementById('obj').data = doc.output("datauristring");

please, try correct me if I wrong.

    try {
    var a;
    var b = new jsPDF("p", "pt", "a3");
    var c = document.getElementById("leftPieCanvas").toDataURL("image/png");
    b.addImage(c, "PNG", 265, 60);
    a = document.getElementById("rightPieCanvas").toDataURL("image/png");
    b.addImage(a, "PNG", 205, 440);
    if ($("#sales_table").length) {
        var d = tableToJson($("#sales_table").get(0));
        b.setFont("helvetica");
        b.setFontType("bold");
        b.setFontSize(9);
        $.each(d, function(a, c) {
            $.each(c, function(c, d) {
                b.cell(40, 830, 55, 20, d, a);
            });
        });
    }
    //b.output('dataurlnewwindow');
    var uri = b.output('dataurlstring');
    openDataUriWindow(uri);
} catch (e) {
    alert(e);
}


function openDataUriWindow(url) {
    var html = '<html>' +
        '<style>html, body { padding: 0; margin: 0; } iframe { width: 100%; height: 100%; border: 0;}  </style>' +
        '<body>' +
        '<iframe src="' + url + '"></iframe>' +
        '</body></html>';
    a = window.open();
    a.document.write(html);
}
<iframe id="ManualFrame"
        frameborder="0"
        style="border:0"
        allowfullscreen>
</iframe>

<script>
    $(function () {
        setManualFrame();
    });

    function setManualFrame() {
        $("#ManualFrame").attr("height", screen.height);
        $("#ManualFrame").attr("width", screen.width);
        $("#ManualFrame").attr("src", "data:application/pdf;base64," + Your_PDF_Data);
    }
</script>

本文标签: javascriptNot allowed to navigate top frame to data URL JsPDFStack Overflow