将照片发送到新窗口

时间:2014-05-02 16:56:38

标签: javascript html html5 dom

我试图制作图片幻灯片并将其发送到另一个窗口。但在选择图像并按下按钮显示幻灯片后,没有任何反应。我使用firebug来检测错误,当我出错时。但是我没有从萤火虫那里得到任何错误,所以我得问你们。这是我的代码。         var infoBox;         var formTag;         var imgUrlList;         var imgTextList;         var windVar;         var urlList;         var textList;

    function init() {
        var i;
        infoBox = document.getElementsByClassName("outerBox");
        for (i=0; i<infoBox.length; i++) {
            infoBox[i].onmouseover = showInfoBox;
            infoBox[i].onmouseout = hideInfoBox;
        }
        formTag = document.getElementsByTagName("input");
        for (i=0; i<formTag.length; i++) {
            formTag[i].onclick = checkedBox;
        }

        windVar = null;
        imgTextList = [];
        imgUrlList = [];
    }
    window.onload = init;

    function showInfoBox() {
        var showInfo;
        showInfo = this.getElementsByClassName("innerBox")[0];
        showInfo.style.visibility = "visible";
    }

    function hideInfoBox() {
        var hideInfo;
        hideInfo = this.getElementsByClassName("innerBox")[0];
        hideInfo.style.visibility = "hidden";
    }

    function checkedBox() {
        var ImgNode, ImgTag;
        for (i=0; i<formTag.length; i++) {
            imgNode = this.parentNode.parentNode.firstChild;
            imgTag = imgNode.nextSibling
            if (this.checked) {
                imgTag.className = "markedImg";
            }
            else { 
                imgTag.className = "unmarkedImg";
            }
        }
    }
    function slideShowBtn() {
        var url, i, filename;
        imgUrlList.length = 0;
        imgTextList.length = 0;
        for (i=0; i<formTag.length; i++) {
            if (formTag.checked) {
                url = infoBox.firstChild.getElementsByTagName("img")[i].src;
                filename = infoBox.firstChild.getElementsByTagName("span")[i].src;
                    imgUrlList.push(url);
                    imgTextList.push(filename);
            }
            else break;
        }
        newWindow(700,600,"slideshow.htm");
    }

    function newWindow(width,height,fileName) {
        var windProporties;
        windProporties = "top=100, left=100,toolbar=no,status=no,menubar=no,scrollbars=no,resizable=no,width=" + width + ",height=" + height;
        if (windVar != null) if (windVar.closed == false) windVar.close();
        windVar = window.open(fileName,"bildspel",windProporties);
    }

formTag变量来自checkbox-input-tag。我决定选择哪些图片并将其移动到新页面。 ImgTextList和imgUrlList是全局变量,它们也将在下一个窗口中。 infoBox是对div类的引用,它被称为OuterBox,里面是另一个名为innerBox的div类,它位于innerBox classdiv中,img和span-tags是。幻灯片的代码已经编写完毕,我只是编写代码来发送变量。

编辑:我应该提供更多信息。但这里是window.opener存在的幻灯片部分的代码。我已经添加了上面剩下的所有代码。你如何嵌入文件?

   // JavaScript for the slideshow page

    // ----- Global variables -----
    var imgUrlList = window.opener.imgUrlList; // Array with filenames of selected images. Initialized to an empty array.
    var imgTextList = window.opener.imgTextList; // Array with image texts of selected images. Initialized to an empty array.
    var slideshowMenu = null; // Reference to the image menu.
    var slideshowImg = null; // Reference to the slideshow img tag.
    var slideshowText = null; // Reference to the tag for the image text.

    // ---- Create the image menu and show the first image. Also attach event handlers. ----
    function initSlideshow() {
// Create a image list from the content of the variable imgUrlList
        var HTMLcode = "<select id='imgMenu'>";
        for (var i=0; i<imgTextList.length; i++) {
            HTMLcode += "<option>" + imgTextList[i] + "</option>";
        } // End for
        HTMLcode += "</select>";
        document.getElementById("iMenu").innerHTML = HTMLcode; // Add the select and option tags to the HTML code
        slideshowMenu = document.getElementById("imgMenu"); // Save a reference to the menu's select tag
        slideshowMenu.selectedIndex = 0; // Select the first option in the menu
        slideshowImg = document.getElementById("slideshowBox").getElementsByTagName("img")[0];
        slideshowText = document.getElementById("slideshowBox").getElementsByTagName("div")[0];
        // Show the first image
        slideshowImg.src = imgUrlList[0];
        slideshowText.innerHTML = imgTextList[0];
        // Attach event handlers
        var slideshowButtons = document.getElementById("slideshowForm").getElementsByTagName("input");
        slideshowButtons[0].onclick = showPrevImage;
        slideshowButtons[1].onclick = showNextImage;
        slideshowMenu.onchange = showSelectedImage;
    } // End initSlideshow
    window.onload = initSlideshow;

    // ---- Show previous image in the list (menu) ----
    function showPrevImage() {
        var ix = slideshowMenu.selectedIndex; // Index for the current image
        if (ix > 0) { // If it's not already the first image
            slideshowMenu.selectedIndex = ix-1;
            slideshowImg.src = imgUrlList[ix-1];
            slideshowText.innerHTML = imgTextList[ix-1];
        }
    } // End showPrevImage

    // ---- Show next image in the list (menu) ----
    function showNextImage() {
        var ix = slideshowMenu.selectedIndex; // Index for the current image
        if (ix < slideshowMenu.length-1) { // If it's not already the last image
            slideshowMenu.selectedIndex = ix+1;
            slideshowImg.src = imgUrlList[ix+1];
            slideshowText.innerHTML = imgTextList[ix+1];
        }
    } // End showNextImage

    // ---- Show selected image in the list (menu) ----
    function showSelectedImage() {
        var ix = slideshowMenu.selectedIndex; // Index for the selected image
        slideshowImg.src = imgUrlList[ix];
        slideshowText.innerHTML = imgTextList[ix];
    } // End showSelectedImage

1 个答案:

答案 0 :(得分:0)

嗯,你从不做任何事情发送它。将其作为查询字符串参数传递,或让子项在开启器中引用全局变量。

var foo = window.opener.imgUrlList;