如何在第二个监视器屏幕上显示HTML页面的DIV标签的内容?

我需要在多显示器屏幕场景中显示DIV标签的内容。 在我的HTML页面上,我们有四个包含内容的DIV。 全部用于实现拖放function的标签。 根据要求,用户可以选择四个中的任何一个标签,并且可以在三个监视器屏幕中的一个上拖动,并且该DIV的内容将在丢弃的监视器屏幕上以全屏模式显示。

任何人都可以建议任何实施此类要求。

浏览器中的JS没有对操作系统的访问级别。 你不能这样做。

我真的不明白你的问题,但这可能会对你有所帮助。

对于拖动实现:

尝试使用interact.js http://interactjs.io/(JavaScript拖放,resize和多点触控手势,惯性和捕捉现代浏览器)

这是一个类似于您需要的示例。 见http://nathanleclaire.com/blog/2014/01/11/dragging-and-dropping-images-from-one-browser-tab-to-another-in-angularjs/

您必须打开同一站点/ webapp的两个浏览器选项卡。 例如; 在左边是你的来源,在右边(显示器)是你的下降点。

我希望它对你有所帮助。

即使我同意@ Quentin的答案,这是不可能的,

这是我能想到的最接近的:
– 但我不确定它会在掉线屏幕上打开,这很可能真的依赖于操作系统,
– 用户需要点击弹出窗口才能使页面全屏显示。

var drag = document.getElementById('drag'); drag.draggable = true; drag.addEventListener('dragover', function(e){e.preventDefault();}, false); drag.addEventListener('dragstart', function(e){e.dataTransfer.setData('text/plain', '');}, false); drag.addEventListener('dragend', openClone, false); function openClone(e){ // create a clone of our div var elem = drag.cloneNode(true); // create a new script element that will contain the fullscreen code var script = document.createElement('script'); script.innerHTML = 'document.onclick='+polyFullScreen.toString(); elem.appendChild(script); // create a new blob from our div var blob = new Blob([elem.outerHTML], { type: "text/html" }); // make it into an objectUrl var url = window.URL.createObjectURL(blob); // open the popup var popup = window.open(url, "popup" ,'width="100%", height="100%"'); } var polyFullScreen = function(e){ var elem = e.target; if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.msRequestFullscreen) { elem.msRequestFullscreen(); } else if (elem.mozRequestFullScreen) { elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullscreen) { elem.webkitRequestFullscreen(); } }; 

的jsfiddle