Question

基本上我试图根据原始页面中的选定图像打开一个新窗口。

这里有fiddle包含我目前所拥有的内容，但我希望能够使用不同的CSS和JavaScript文件打开新窗口。

当前的JavaScript：

var tickBoxHTML = "<div class='tickBox unselected'></div>"; $("img").after(tickBoxHTML);

$(".tickBox").click(function () {
    $(this).toggleClass("tickBox selected", "tickBox unselected"); });

$("#compare").click(function () {

    var compareText = "<p>Selected images for comparison:</p>";

    $(".selected").each(function () {
        var thisSrc = $(this).prev("img").attr("src");
        var thisAlt = $(this).prev("img").attr("alt");
        compareText += "<div><img src='" + thisSrc + "' alt='" + thisAlt + "' /></div>";
    });

    compareText += "<br><button onClick='window.close()'>Close Window</button>"

    var compareWindow = window.open();
    compareWindow.document.body.insertAdjacentHTML("beforeend", compareText);

});

Answer 1

您可以加载包含JS和CSS的页面以及来自同一域的普通网页中使用的所有元素，然后等待新创建的窗口的onload触发，并在此之后添加一些内容。像这样：

$('#compare').click(function () {
    var win = $(window.open('URL_here', 'win'));
    win.on('load', function () {
        $(this.document.body).append(compareText);
    });
});

Answer 2

只需将window.open（）方法与值

一起使用即可

window.open(URL, "_blank", strWindowFeatures);

strWindowFeatures用于新窗口的重量或高度。例如

window.open(URL, "_blank",height=570,width=520);

如何使用CSS和JavaScript打开一个新窗口？

2 个答案: