簡體   English   中英

在子窗口中使用數組元素使用getElementById更改父窗口中的圖像

[英]Using array element in child window to change image in parent window with getElementById

因此,我正在嘗試完成一些javascript,並且在編碼鏈接以更新圖像時遇到了麻煩。 在使用腳本的父窗口中,我打開一個遠程子窗口來操作圖像。 子窗口上的鏈接打開第一個圖像和最后一個圖像。 另外兩個鏈接控制“下一個”圖像和上一個圖像。

這是我到目前為止的

HTML父窗口:(尚未弄清楚如何在此處發布html :()

<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");

}
}

無論如何,我正在預加載圖像,並且正確地找到了該圖像。 我正在嘗試訪問image標簽中父節點中的元素並顯示一個數組元素1-6。 換句話說,圖像1到圖像6的想法是按下子節點中的按鈕並顯示第一個圖像元素[0]以供理解按下另一個按鈕元素[5]或按下另一個按鈕以顯示下一個元素[i + 1]另一個按鈕。 謝謝您的幫助。

有很多方法可以在父窗口和子窗口之間進行通信。 請參閱此以獲取更多信息。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM