如何使用Javascript弹出打印对话框?

2020/10/29 12:02 · javascript ·  · 0评论

我有一个带有“打印”链接的页面,该链接将用户带到易于打印的页面。客户端希望在用户到达易于打印的页面时自动显示打印对话框。如何使用javascript执行此操作?

window.print();  

除非您的意思是自定义外观弹出窗口。

你可以做

<body onload="window.print()">
...
</body>

我喜欢这样,以便您可以添加所需的任何字段并以这种方式进行打印。

function printPage() {
    var w = window.open();

    var headers =  $("#headers").html();
    var field= $("#field1").html();
    var field2= $("#field2").html();

    var html = "<!DOCTYPE HTML>";
    html += '<html lang="en-us">';
    html += '<head><style></style></head>';
    html += "<body>";

    //check to see if they are null so "undefined" doesnt print on the page. <br>s optional, just to give space
    if(headers != null) html += headers + "<br/><br/>";
    if(field != null) html += field + "<br/><br/>";
    if(field2 != null) html += field2 + "<br/><br/>";

    html += "</body>";
    w.document.write(html);
    w.window.print();
    w.document.close();
};

我这样做是为了确保他们记得要打印风景,这对于许多打印机上的许多页面来说都是必需的。

<a href="javascript:alert('Please be sure to set your printer to Landscape.');window.print();">Print Me...</a>

要么

<body onload="alert('Please be sure to set your printer to Landscape.');window.print();">
etc.
</body>

如果您只有一个没有单击事件处理程序的链接:

<a href="javascript:window.print();">Print Page</a>

您可以将其绑定到按钮或页面上。

window.print();

我知道已经提供了答案。但是我只是想详细说明在Blazor应用程序(剃刀)中执行此操作的过程...

您需要注入IJSRuntime才能执行JSInterop(从C#运行javascript函数)

在您的剃刀页面中:

@inject IJSRuntime JSRuntime

一旦注入,就创建一个带有单击事件的按钮,该事件调用C#方法:

<MatFAB Icon="@MatIconNames.Print" OnClick="@(async () => await print())"></MatFAB>

(或更简单的方法,如果您不使用MatBlazor)

<button @onclick="@(async () => await print())">PRINT</button>

对于C#方法:

public async Task print()
{
    await JSRuntime.InvokeVoidAsync("printDocument");
}

现在输入index.html:

<script>
    function printDocument() {
        window.print();
    }
</script>

需要注意的是,onclick事件是异步的,是因为IJSRuntime等待它的调用,例如InvokeVoidAsync

PS:例如,如果要在ASP Net Core中显示消息框:

await JSRuntime.InvokeAsync<string>("alert", "Hello user, this is the message box");

要有一个确认消息框:

bool question = await JSRuntime.InvokeAsync<bool>("confirm", "Are you sure you want to do this?");
    if(question == true)
    {
        //user clicked yes
    }
    else
    {
        //user clicked no
    }

希望这可以帮助 :)

如果有问题:

 mywindow.print();

替代使用:

'<scr'+'ipt>print()</scr'+'ipt>'

充分:

 $('.print-ticket').click(function(){

        var body = $('body').html();
        var ticket_area = '<aside class="widget tickets">' + $('.widget.tickets').html() + '</aside>';

        $('body').html(ticket_area);
        var print_html = '<html lang="tr">' + $('html').html() + '<scr'+'ipt>print()</scr'+'ipt>' + '</html>'; 
        $('body').html(body);

        var mywindow = window.open('', 'my div', 'height=600,width=800');
        mywindow.document.write(print_html);
        mywindow.document.close(); // necessary for IE >= 10'</html>'
        mywindow.focus(); // necessary for IE >= 10
        //mywindow.print();
        mywindow.close();

        return true;
    });
本文地址:http://javascript.askforanswer.com/ruheshiyongjavascriptdanchudayinduihuakuang.html
文章标签:
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!