简介

本控件能实现在页面浏览中弹出内联框架窗口（支持多个窗口的打开），并在屏幕宽度小到不能完全展示窗口时直接跳转到要打开的页面或最大化窗口以显示页面。

不同于本站之前发布的内联框架控件，本控件基于自由窗口组件，代码更简洁。

预览

试用

URL：

创建窗口

试用代码

URL：<input type="text" placeholder="URL" value="https://www.mcjiaozi.com" id="set_url" /><br><br>
<button onclick="iframe2(document.getElementById('set_url').value);">创建窗口</button>

使用方法（JavaScript）

前置文件

在使用本控件前，请先引用iwindow.js（自由窗口组件）。本实例版本为V1.4。

函数

创建窗口

iframe2(url, newPage = false, x, y, height = 540, width = 370)

参数名	描述	可选值	值的描述	缺省值
url	目标地址	字符串	任意字符串	null
newPage	窗口过小时的操作	布尔值	true: 在当前页面中打开页面 false: 全屏控件窗口并打开页面	false
x	窗口横坐标	数字	单位px	null
y	窗口纵坐标	数字	单位px	null
height	窗口高度	数字	单位px	540
width	窗口宽度	数字	单位px	370

代码（JavaScript）

function iframe2(url, newPage = false, x, y, height = 540, width = 370) {
    if (x = null) x = document.documentElement.clientWidth - width - 80 + "px";
    if (y = null) y = document.documentElement.clientHeight - height - 30 + "px";
    menu = [["在当前页面中打开", (i) => { window.location.href = document.getElementById("iwindow_window_content_" + i).getElementsByTagName("iframe")[0].contentWindow.location.href; }],
    ["在新标签页中打开", (i) => { window.open(document.getElementById("iwindow_window_content_" + i).getElementsByTagName("iframe")[0].contentWindow.location.href); }],
    ["复制链接地址", (i) => {
        var tag = document.createElement("input");
        tag.id = "copy_text_aaa_input";
        tag.value = document.getElementById("iwindow_window_content_" + i).getElementsByTagName("iframe")[0].contentWindow.location.href;
        tag.style.opacity = "0";
        document.body.appendChild(tag);
        document.getElementById("copy_text_aaa_input").select();
        document.execCommand("copy");
        document.getElementById("copy_text_aaa_input").parentNode.removeChild(document.getElementById("copy_text_aaa_input"));
    }]];
    var i = 0;
    if (document.documentElement.clientWidth < width + 80 || document.documentElement.clientHeight < height + 30) {
        if (!newPage) i = iwindow({ "x": x, "y": y, "height": height, "width": width, "title": url, "content": "", "mode": 5, "menu": menu, "size": 2, "mask": false, "content_overflow": "hidden" });
        else {
            window.location.href = url;
            return;
        }
    }
    else i = iwindow({ "x": x, "y": y, "height": height, "width": width, "title": url, "content": "", "mode": 1, "menu": menu, "size": 1, "mask": false, "content_overflow": "hidden" });
    var iframe = document.createElement("iframe");
    iframe.src = url;
    iframe.style.height = "100%";
    iframe.style.width = "100%";
    iframe.style.border = "none";
    iframe.style.margin = "0";
    iframe.onload = function () {
        if (iframe.contentWindow.document.title != null && iframe.contentWindow.document.title !== "") document.getElementById("iwindow_window_title_words_" + i).innerHTML = iframe.contentWindow.document.title;
        else document.getElementById("iwindow_window_title_words_" + i).innerHTML = iframe.contentWindow.location.href;
    }
    document.getElementById("iwindow_window_content_" + i).appendChild(iframe);
}

兼容性

不支持Internet Explorer。