Question

所以我正在尝试完成一些JavaScript并且无法编写链接以更新图像。在使用我的脚本的父窗口中，我打开一个远程子窗口来操作图像。子窗口上的链接打开第一个图像和最后一个图像。另外两个链接控制“下一个”图像和前一个图像。

到目前为止我所拥有的是什么

HTML PARENT WINDOW :(还没弄明白如何在这里发布html btw :(）

<html>
    <head>
    <title> </title>
    <script type="text/javascript" src="scriptss.js">
    </script>
    </head>
    <body>
    <img src="images/img0.jpg" width="200px" height="200px" id="myImage"        name="myImage" /></img>
    <h1>XXX</h1>
    <a href="#"  id = "opens" >open</a>
    </br>
    <a href="#" id="closes">close</a>
    </br>
    </body>
    <html>

子窗口HTML：

<html>
<head>
    <title> Matt Beckley Assignment Remote</title>
    <link rel="stylesheet" type="text/css" href="remote.css" />
<script type="text/javascript" src="scriptss.js">
</script>
</head>
     <body>
     <h1>My Remote</h1>
     <a href="#" id="first" onclick="first()">First Image</a>
     </br>
     <a href="#" id="next">Next Image</a>
     </br>
     <a href="#" id="previous">Previous Image</a>
     </br>
     <a href="#" id="last">Last Image</a>
     </br>
     <a href="#" id="closess">close</a>
     </body>
  </html>

JAVASCRIPT子节点

  var newWindow = null;
  window.onload = init;
  var myImages = new Array();

  //start loop - length depends on how many images you need to preload
  for (var i=0; i<5; i++) {
    //create new image object
    var tempImage = new Image();
    //assign name|path of image to src property of image object
    tempImage.src = "img" + (i+1) + ".jpg";
    }


function init()
{
for(var i=0; i<document.links.length; i++)
{
document.links[i].onclick = changeWindowState;
}

}

function windowOpen(){
if(newWindow && !newWindow.closed){
    return true;
}
return false;
}


function changeWindowState()
{
if (this.id =="closes")
{
    if(windowOpen())
    {
        newWindow.close();
    }
    else
    {
        alert("The window isn't open");
    }
}
if (this.id =="closess")
{
    if(windowOpen())
    {
        remotetest.html.close();
    }
    else
    {
        alert("The window isn't open");
    }
}
if(this.id == "opens")
{
    if(windowOpen())
    {
        alert("The Window is alreadyopen!");
    }
    else
    {
    newWindow = window.open ("remotetest.html","remoteWin","resizeable=no,width=200,height=200");
    }
}
return false;
}



function first()
{
if(this.id == "first")
{
alert("box");
}
else(this.id == "first") 

{
alert("box");

}
}

无论如何我正在预加载我的图像，我弄清楚了。我正在尝试访问图像标记中父节点中的元素并显示数组元素1-6。换句话说，图像1到图像6 这个想法是按下子节点中的一个按钮并显示第一个图像元素[0] for instand按下另一个按钮元素[5] 或者用另一个按钮按下另一个元素[i + 1]。谢谢你的帮助。

Answer 1

如何在父窗口和子窗口之间进行通信有很多方法。 See this for more info.

使用子窗口中的数组元素使用getElementById更改父窗口中的图像

1 个答案: