js 中控制打印方向横向还是纵向。

文章介绍了如何使用CSS的`@page`规则设置打印方向为横向(landscape)或纵向(portrait),并提供了一个JavaScript函数`$changePrint`来动态切换打印样式。通过传入参数,函数返回对应的CSS样式并可添加到打印容器div中,实现横纵打印的切换功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

打印方向控制

@page { size: landscape; }//横向
@page { size: portrait; }//纵向

但是写在Css 中无法切换还是要写在js中。

//切换打印方向
let $changePrint = function (type) {
  let html = '';
  type = type?type:1;

  if(type=='1'){
    html='<style type="text/css" media="print">\n' + '  @page { size: landscape; }\n' + '</style>';
  }else{
    html='<style type="text/css" media="print">\n' + '  @page { size: portrait; }\n' + '</style>';
  }

  return html;
};

type==1=>横打;type==2=>纵打。

将函数返回的html append到打印的容器div中即可。

$('#printDiv').append($changePrint(type));

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值