window.open打開新窗口left不生效以及父子界面交互傳參


今天做個功能,通過window.open(url,'_blank','width=400, height=400, left=100, top=100') ,這樣寫在只有一個顯示器的電腦上展示沒有問題,新打開的窗口位置確實離左側100px,但是放到有分屏的顯示器上,就跑偏了,特此記錄下解決方式,避免下次踩坑;

解決代碼如下:

//screen.width=顯示屏幕的寬度,就是您的Windows設置的分辨率,w變量值因為業務需要所以對大小屏做了個判斷,可自行設置,一般默認1000就可以居中
var w = screen.width < 1500 ? 870 : 1350;
 
var x = (window.screenX || window.screenLeft || 0) + (screen.width - w) / 2;
 
//因為window.open的第三個參數想要生效,需要在一個字符串中用逗號分隔,所以把left拼接在最后一個即可
myWindow = window.open(URL, '_blank', 'height=400, width=400, top=170, menubar=no, scrollbars=no, resizable=no,location=no, status=no, left='+x);
 
父子界面通信
window.open父子界面通信有很多種方法,一般常用的就是地址欄傳參,比如下面這種寫法:
 
第一種(父傳子,子獲取):
//父界面
window.open('module/index/his_video.html?startTime='+startTime+'&endTime='+endTime, '_blank', 'height=800, width=600, top=170, menubar=no, scrollbars=no, resizable=no,location=no, status=no, left=100');
 
//子界面
 
/**首先定義方法解析參數**/
function getSearch(str) {
if (!str) return;
str = decodeURI(str);//這個方法是給URL進行解析,解決中文亂碼問題
str = str.slice(1);
let arr = str.split("&");
for (let i = 0; i < arr.length; i++) {
arr[i] = arr[i].split("=");
publicVar[arr[i][0]] = arr[i][1];
}
return publicVar;
}
 
//執行就可以拿到對應參數值
getSearch(location.search);
 
 
第二種(子去拿父):
 
//父界面定義隱藏域存值
<input type="hidden"  value="" id="historyEventList">
 
//子界面取值
opener.document.getElementById("historyEventList").value;
 
//子界面去調用父界面相關方法
opener.方法名()
 
好了記錄就到這,后續有問題再溝通吧;


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM