JavaScript弹出窗口的问题

时间:2016-10-15 14:21:31

标签: javascript html popup

我现在对弹出窗口有些麻烦。我想在其中放置一些带有图像的弹出窗口,但每个弹出窗口仅显示列表中最后一个弹出窗口的图像(在本例中为20)。我搜索了它,它说newWindow.document.write(text);中有一个错误,但它可能与setTimeout( function()有关。我希望你们能帮助我。

这是代码:

<HEAD>
<title>PopUp</title>

<SCRIPT LANGUAGE="JavaScript">
function popups(){popupWin1();popupWin2();popupWin3();popupWin4();popupWin5();popupWin6();popupWin7();popupWin8();popupWin9();popupWin10();popupWin11();popupWin12();popupWin13();popupWin14();popupWin15();popupWin16();popupWin17();popupWin18();popupWin19();popupWin20();}
function popupWin1() {

text =  "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:6px; HEIGHT:100% src=giphy4.gif style=height:100%></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin1','width=800,height=400,left=100,top=100,');
newWindow.document.write(text);
}, 1000);  
// time delay of pop-ups
}

function popupWin2() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=tumblr_o4j9rpai7K1tj7oyqo1_500.gif style=height:100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin2','width=900,height=800,left=700,top=600,');
newWindow.document.write(text);
}, 5000)

}

function popupWin3() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=randycano_pre.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin3','width=400,height=600,left=30,top=400,');
newWindow.document.write(text);
}, 10500)

}

function popupWin4() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin4','width=1000,height=800,left=500,top=100,');
newWindow.document.write(text);
}, 15500)

}

function popupWin5() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=tumblr_o2w65pSscx1uluhv2o1_500.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin5','width=800,height=500,left=600,top=400,');
newWindow.document.write(text);
}, 17500)

}

function popupWin6() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=BelovedVacantChihuahua-size_restricted.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin6','width=700,height=450,left=200,top=700,');
newWindow.document.write(text);
}, 20000)

}

function popupWin7() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy2.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin7','width=450,height=750,left=400,top=400,');
newWindow.document.write(text);
}, 22000)

}

function popupWin8() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=rcano1.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin8','width=900,height=400,left=550,top=500,');
newWindow.document.write(text);
}, 27000)

}

function popupWin9() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=jelly-gummies-db-test-01.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin9','width=850,height=670,left=450,top=600,');
newWindow.document.write(text);
}, 33500)

}

function popupWin10() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy3.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin10','width=550,height=600,left=150,top=100,');
newWindow.document.write(text);
}, 36000)

}

function popupWin11() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=9897574_one-year-of-gifs--gif-six-pack_t4d3d6bfc.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin11','width=400,height=900,left=750,top=700,');
newWindow.document.write(text);
}, 39500)

}

function popupWin12() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy4.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin12','width=500,height=900,left=350,top=100,');
newWindow.document.write(text);
}, 42000)

}

function popupWin13() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=200.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin13','width=500,height=650,left=850,top=700,');
newWindow.document.write(text);
}, 45500)

}

function popupWin14() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy5.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin14','width=500,height=650,left=50,top=250,');
newWindow.document.write(text);
}, 47600)

}

function popupWin15() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=201.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin15','width=500,height=750,left=50,top=200,');
newWindow.document.write(text);
}, 48700)

}

function popupWin16() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=202.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin16','width=500,height=500,left=150,top=0,');
newWindow.document.write(text);
}, 49800)

}

function popupWin17() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy2.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin17','width=500,height=700,left=350,top=100,');
newWindow.document.write(text);
}, 50850)

}

function popupWin18() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=black><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=202.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin18','width=500,height=600,left=0,top=800,');
newWindow.document.write(text);
}, 51900)

}

function popupWin19() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=yellow><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=giphy4.gif style=height:100% width=100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin19','width=500,height=620,left=30,top=0,');
newWindow.document.write(text);
}, 52950)

}

function popupWin20() {

text = "<html>\n<head>\n<title></title>\n<body bgcolor=yellow><img STYLE=position:absolute; TOP:0px; LEFT:0px; src=randy-cano-melting-motion-graphics-animation-designboom-818_2.gif style=height:100%;></body>\n</html>\n";
setTimeout( function()
{
newWindow = window.open('','newWin20','width=500,height=400,left=650,top=400,');
newWindow.document.write(text);
}, 54000)

}

</script>

</HEAD>

<BODY onLoad="popups()">

1 个答案:

答案 0 :(得分:0)

是的,所以你的问题是当你创建要在弹出窗口中显示的HTML时,你将其命名为“text”。然后你每次都调用那个文本,基本上反复调用第一个HTML。

newWindow.document.write(text);

你有上述20行。 将其更改为:

-- CODE --
newWindow.document.write(text1);
-- CODE --
newWindow.document.write(text2);
-- CODE --
newWindow.document.write(text3);
-- CODE --

我对你的代码进行了一些风格化,它运行正常。看看:

function popups(){popupWin1();popupWin2()}
    function popupWin1() {

        text =  "<html>" +
                "<head>" +
                "<title></title>" +
                "<body bgcolor=black>" +
                "<img STYLE=position:absolute; " +
                "TOP:0px; LEFT:6px; HEIGHT:100% " +
                "src='http://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png?v=c78bd457575a' " +
                "style=height:100%>" +
                "</body>" +
                "</html>";
        setTimeout( function()
        {
            newWindow = window.open('','newWin1','width=800,height=400,left=100,top=100,');
            newWindow.document.write(text);
        }, 1000);
    }
    function popupWin2() {

        text2 =  "<html>" +
                "<head>" +
                "<title></title>" +
                "<body bgcolor=black>" +
                "<img STYLE=position:absolute; " +
                "TOP:0px; LEFT:6px; HEIGHT:100% " +
                "src='https://www.w3.org/html/logo/downloads/HTML5_Logo_512.png' " +
                "style=height:100%>" +
                "</body>" +
                "</html>";
        setTimeout( function()
        {
            newWindow = window.open('','newWin2','width=800,height=400,left=100,top=100,');
            newWindow.document.write(text2);
        }, 1000);
    }

我希望有帮助

相关问题