html显示器对象属性,Web网站中利用JavaScript中ActiveXObject对象获取硬件信息(显示器数量、分辨率)从而进行单双屏跳转...

前言:最近这两天工作上,要实现一个功能,在好友阿聪的帮助下,算是比较好的解决了这个需求。

B/S的Web网站,需要实现点击按钮时,根据客户端连接的显示屏(监视器)数量进行,单双屏跳转显示新页面。

由于是Web网站,项目是要发布在服务端上,通过后台去读硬件信息,也是读到的是服务器的硬件信息。

故考虑用JS中的ActiveXObject对象,读取到硬件的显示器(监视器)信息,比如数量、分辨率。

此处使用ActiveXObject对象,由于项目限制用的是IE9,打开窗口用的是window.open()

创建ActiveXObject对象,查询监视器的信息。

var locator = new ActiveXObject("WbemScripting.SWbemLocator");var service = locator.ConnectServer(".");//显示器

var xsq = new Enumerator(service.ExecQuery("select * from Win32_DesktopMonitor"));//得到所有显示器的分辨率//如果有2个显示器,则有2对分辨率;反之,则为1个显示器//考虑到后期可能有3个显示屏,所以如下去取值。

varxsq1Width;varxsq1Height;varxsq2Width;varxsq2Height;var i = 1;for (; !xsq.atEnd() ; xsq.moveNext()) {if (i == 1) {

xsq1Width=xsq.item().ScreenWidth;

xsq1Height=xsq.item().ScreenHeight;

}else if (i == 2) {

xsq2Width=xsq.item().ScreenWidth;

xsq2Height=xsq.item().ScreenHeight;

}

i++;

}

为何我要取的是监视器的分辨率,而不是监视器的Name,这是根据取到的数据发现:1个屏时,监视器2的分辨率宽、高是有值的,监视器2的分辨率宽、高为null

由此根据分辨率宽、高是否为null,来判断是否是单屏。

//判断单双屏

if (xsq2Width == null && xsq2Height == null) {

window.open("about:blank", "", "top=0,left=0,width=" + xsq1Width + ",height=" + xsq1Height + "");

}else{//双屏时

}

双屏时,发现用window.screenLeft、window.screen.width、window.screen.height、得到的监视器1、2的宽/高

去判断,哪个是主屏?程序在主屏上启动时,在副屏上启动时。

//显示器1是主屏

if (window.screen.width == xsq1Width && window.screen.height ==xsq1Height) {if (window.screenLeft >= 0 && window.screenLeft

window.open("about:blank", "", "top=0,left=" + xsq1Width + ",width=" + xsq2Width + ",height=" + xsq2Height + "");

}if (window.screenLeft >= xsq1Width && window.screenLeft < (xsq1Width +xsq2Width)) {//从右向左跳

window.open("about:blank", "", "top=0,left=0,width=" + xsq1Width + ",height=" + xsq1Height + "");

}

}//显示器2是主屏

if (window.screen.width == xsq2Width && window.screen.height ==xsq2Height) {if (window.screenLeft >= 0 && window.screenLeft

//由于此处跳转有点问题,不能向左偏移。window.open("about:blank", "", "top=0,left=0,width=" + xsq1Width + ",height=" + xsq1Height + "");

}if (window.screenLeft >= (-xsq1Width) && window.screenLeft < 0) {//从左向右跳

var objWin = window.open("about:blank", "", "top=0,left=0,width=" + xsq2Width + ",height=" + xsq2Height + "");

}

}

上面代码中,标红的打开新窗口跳转,按照我的逻辑应该是从右向左跳转,但是不知为何,在IE9中,window.open()  向左偏移不了。

于是就打算在打开的新窗口中去加速window.moveTo(-显示屏宽度,0);以此来达到向左偏移的目的。

最后将完整代码附上,也就是一个html页面:

JavaScript单双屏跳转

window.οnlοad= function() {

document.getElementById("btnZX").οnclick= function() {varlocator= newActiveXObject("WbemScripting.SWbemLocator");varservice=locator.ConnectServer(".");//显示器

varxsq= newEnumerator(service.ExecQuery("select * from Win32_DesktopMonitor"));//得到所有显示器的分辨率

//如果有2个显示器,则有2对分辨率;反之,则为1个显示器

varxsq1Width;varxsq1Height;varxsq2Width;varxsq2Height;vari= 1;for(;!xsq.atEnd() ; xsq.moveNext()) {if(i== 1) {

xsq1Width=xsq.item().ScreenWidth;

xsq1Height=xsq.item().ScreenHeight;

}else if(i== 2) {

xsq2Width=xsq.item().ScreenWidth;

xsq2Height=xsq.item().ScreenHeight;

}

i++;

}//判断单双屏

if(xsq2Width== null &&xsq2Height== null) {

window.open("about:blank","","top=0,left=0,width=" +xsq1Width+ ",height=" +xsq1Height+ "");

}else{

alert("\n\twindow.screenLeft" +window.screenLeft+ "\n\twindow.screen.width" +window.screen.width+ "\n\txsq1Width" +xsq1Width+ "\n\txsq2Width" +xsq2Width);//显示器1是主屏

if(window.screen.width==xsq1Width&&window.screen.height==xsq1Height) {if(window.screenLeft>= 0 &&window.screenLeft

window.open("about:blank","","top=0,left=" +xsq1Width+ ",width=" +xsq2Width+ ",height=" +xsq2Height+ "");

}if(window.screenLeft>=xsq1Width&&window.screenLeft

window.open("about:blank","","top=0,left=0,width=" +xsq1Width+ ",height=" +xsq1Height+ "");

}

}//显示器2是主屏

if(window.screen.width==xsq2Width&&window.screen.height==xsq2Height) {if(window.screenLeft>= 0 &&window.screenLeft

//由于此处跳转有点问题,不能向左偏移

window.open("http://localhost:6019/NewPage.html","","top=0,left=0,width=" +xsq1Width+ ",height=" +xsq1Height+ "");

}if(window.screenLeft>=(-xsq1Width)&&window.screenLeft< 0) {//从左向右跳

varobjWin=window.open("about:blank","","top=0,left=0,width=" +xsq2Width+ ",height=" +xsq2Height+ "");

}

}

}

}

}

单双屏跳转

新页面
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值