JS_0049：JS 動態建立 frame 框架 嵌入地址 遮蔽鍵盤事件
阿新 • • 發佈：2021-10-09
1，
// 動態建立 IFrame 框架 function showIframe(url,w,h){ //新增iframe var if_w = w; var if_h = h; $("<iframe width='" + if_w + "' height='" + if_h + "' id='iFrame' name='iFrame' style='position:absolute;z-index:4;' frameborder='no' scrolling='no' allowtransparency='yes' security='restricted' sandbox='allow-top-navigation allow-same-origin allow-forms allow-scripts' marginheight='0' marginwidth='0' allowTransparency='true'></iframe>").prependTo('body');//iframe螢幕適應寬高設定 var st=document.documentElement.scrollTop|| document.body.scrollTop;//滾動條距頂部的距離 var sl=document.documentElement.scrollLeft|| document.body.scrollLeft;//滾動條距左邊的距離 var ch=document.documentElement.clientHeight;//螢幕的高度 var cw=document.documentElement.clientWidth;//螢幕的寬度 var objH=$("#iFrame").height();//浮動物件的高度 var objW=$("#iFrame").width();//浮動物件的寬度 var objT=Number(st)+(Number(ch)-Number(objH))/2; var objL=Number(sl)+(Number(cw)-Number(objW))/2; $("#iFramee").css('left',objL); $("#iFrame").css('top',objT); $("#iFrame").attr("src", url) }; showIframe('http://xxx/bushu.html','100%','100%');
// 定義樣式 var t = [ "iframe {", " position: absolute;", " top: 0;", " bottom: 0;", " left: 0;", " right: 0;", " height: 100%;", " width: 100%;", "}", "@media screen and (orientation: portrait){", "}", "@media screen and (orientation: landscape){", "}" ].join("\n"); // 建立樣式 var i = document.createElement("style"); i.type = "text/css"; i.styleSheet ? i.styleSheet.cssText = t : i.appendChild(document.createTextNode(t)); document.head.appendChild(i); // 自動執行的方法 (function () { // console.log("okk"); // 建立iframe // var iframe = document.createElement("iframe"); // iframe.src = "http://xxx/bushu.html"; // document.body.appendChild(iframe); // myHtml += '<iframe name="son" src="http://xxx/bushu.html" width="100%" height="100%" scrolling="no" frameborder="no" frameborder="no" allowtransparency="yes" security="restricted" sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts">' // + '</iframe>'; // 動態建立 IFrame 框架 function showIframe(url,w,h){ //新增iframe var if_w = w; var if_h = h; $("<iframe width='" + if_w + "' height='" + if_h + "' id='iFrame' name='iFrame' style='position:absolute;z-index:4;' frameborder='no' scrolling='no' allowtransparency='yes' security='restricted' sandbox='allow-top-navigation allow-same-origin allow-forms allow-scripts' marginheight='0' marginwidth='0' allowTransparency='true'></iframe>").prependTo('body'); //iframe螢幕適應寬高設定 var st=document.documentElement.scrollTop|| document.body.scrollTop;//滾動條距頂部的距離 var sl=document.documentElement.scrollLeft|| document.body.scrollLeft;//滾動條距左邊的距離 var ch=document.documentElement.clientHeight;//螢幕的高度 var cw=document.documentElement.clientWidth;//螢幕的寬度 var objH=$("#iFrame").height();//浮動物件的高度 var objW=$("#iFrame").width();//浮動物件的寬度 var objT=Number(st)+(Number(ch)-Number(objH))/2; var objL=Number(sl)+(Number(cw)-Number(objW))/2; $("#iFramee").css('left',objL); $("#iFrame").css('top',objT); $("#iFrame").attr("src", url) }; showIframe('http://xxx/bushu.html','100%','100%'); // 建立按鈕 // var cw = document.createElement("div"); // cw.id = "cloWd"; // document.body.appendChild(cw); // document.querySelector("#cloWd").style.display = "none"; // document.getElementById("cloWd").onclick = function () {}; })(); //遮蔽鍵盤事件 document.onkeydown = function () { var e = window.event || arguments[0]; //F12 if (e.keyCode == 123) { return false; //Ctrl+Shift+I } else if ((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)) { return false; //Shift+F10 } else if ((e.shiftKey) && (e.keyCode == 121)) { return false; //Ctrl+U } else if ((e.ctrlKey) && (e.keyCode == 85)) { return false; } else if ((e.keyCode == 122) && (e.keyCode == 123)) { // F11 + F12 return false; } else if ((e.keyCode == 121)) { // F10 return false; } else if ((e.keyCode == 122)) { // F11 return false; } else if ((e.keyCode == 123)) { // F12 return false; } else if ((e.keyCode == 27)) { // EXE return false; } };琥珀君的部落格