У мене є сторінка із посиланням "Друк", що перенаправляє користувача до дружньої сторінки. Клієнт хоче, щоб діалогове вікно друку з'являлося автоматично, коли користувач переходить на сторінку друку. Як я можу це зробити за допомогою JavaScript?
У мене є сторінка із посиланням "Друк", що перенаправляє користувача до дружньої сторінки. Клієнт хоче, щоб діалогове вікно друку з'являлося автоматично, коли користувач переходить на сторінку друку. Як я можу це зробити за допомогою JavaScript?
Відповіді:
window.print(); якщо ви не маєте на увазі спливаюче вікно на замовлення.
Мені це подобається, так що ви можете додавати будь-які потрібні поля та роздруковувати його таким чином.
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>Я знаю, що відповідь вже надана. Але я просто хотів детальніше розповісти про те, як це зробити у програмі Blazor (бритви) ...
Вам потрібно буде ввести IJSRuntime, щоб виконати JSInterop (запуск функцій JavaScript від C #)
НА ВАШІЙ СТРАНИЦІ РАЗОРУ:
@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:
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;
});