js打开新页面打印
时间: 2023-08-05 10:09:42 浏览: 121
以下是打开新页面并打印的 JavaScript 代码:
```javascript
function printPage(url) {
var newWindow = window.open(url);
newWindow.onload = function() {
newWindow.print();
}
}
```
这个函数接受一个 URL 参数,用于打开一个新的窗口。在新窗口加载完成后,会自动触发 `onload` 事件,并调用 `print()` 方法进行打印。你可以在需要打印的页面中调用这个函数实现打开新页面并打印的功能。
相关问题
angular项目中打开新页面打印html页面
您可以使用Angular的内置Router模块来导航到新页面,然后使用JavaScript的window.print()函数来打印HTML页面。以下是示例代码:
在您的组件中,导入Router和ActivatedRoute模块:
```
import { Router, ActivatedRoute } from '@angular/router';
```
在构造函数中注入这些模块:
```
constructor(private router: Router, private route: ActivatedRoute) { }
```
在需要打印HTML页面的函数中,使用Router模块的navigateByUrl方法导航到新页面,并在导航完成后调用window.print()函数:
```
printPage() {
const pageUrl = window.location.href;
const newUrl = pageUrl.split('?')[0] + '/print'; // 添加“/print”路径
this.router.navigateByUrl(newUrl).then(() => {
window.print();
});
}
```
在新页面的组件中,使用ActivatedRoute模块获取HTML页面的内容并显示在页面上:
```
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-print',
template: '<div [innerHTML]="htmlContent"></div>'
})
export class PrintComponent implements OnInit {
htmlContent: string;
constructor(private route: ActivatedRoute) { }
ngOnInit() {
this.htmlContent = this.route.snapshot.queryParamMap.get('html');
}
}
```
在新页面的路由配置中,添加一个路由来匹配“/print”路径,并将HTML内容作为查询参数传递:
```
const routes: Routes = [
{ path: 'print', component: PrintComponent }
];
// 在导航时传递HTML内容
const queryParams = { html: '<h1>要打印的HTML内容</h1>' };
this.router.navigate(['/print'], { queryParams });
```
请注意,这只是一个简单的示例,您需要根据自己的需求进行修改和改进。
angular项目中调用window.open方法打开新页面,打印html页面
您可以使用Angular的内置Router模块来导航到新页面,然后在新页面中使用JavaScript的window.print()函数来打印HTML页面。以下是示例代码:
在您的组件中,导入Router模块:
```
import { Router } from '@angular/router';
```
在构造函数中注入Router模块:
```
constructor(private router: Router) { }
```
在需要打印HTML页面的函数中,使用window.open()方法打开新页面,并在页面加载完成后调用window.print()函数:
```
printPage() {
const htmlContent = '<h1>要打印的HTML内容</h1>'; // 替换为您要打印的HTML内容
const newWindow = window.open('', '_blank');
newWindow.document.write(htmlContent);
newWindow.document.close();
newWindow.onload = () => {
newWindow.print();
};
}
```
请注意,这只是一个简单的示例,您需要根据自己的需求进行修改和改进。