javascript - 为什么我的 javascript window.open 函数读取 url，而不是数组中的宽度和高度参数？

Question

几年前，我用很多 Flash 功能构建了我的网站，尽管是基于 html 文件。我一直在研究 html/css/javascript 替代方案，但卡在最后一页上。它包括一个简单的 (javascript) 幻灯片放映，带有向后和向前按钮以及可在自定义窗口中打开的可单击图像。在 Flash 版本中，图像是嵌入了以下 ActionScript 的 swf 文件:

movieclip_inst.onRelease = function():Void {    
getURL("javascript:openNewWindow('Photopages/A01La_Jolla1.html', 925, 693)");
}  

在 html 文件的头部调用以下 javascript 函数:

    function openNewWindow(page, width, height) { 
OpenWin = this.open(page, "Illustrationslideshow", "toolbar=no, menubar=no ,location=no, scrollbars=yes, resizable=yes, statusbar=no, width=" + width + ", height=" + height + ", top=" + (screen.height/2 - height/2) + ", left=" + (screen.width/2 - width/2) + "\""); 
} 

这将打开外部数组中列出的各个 html 文件，如下所示:

function setupPages() {
var pages = new Array();

pages[0] = 'Photopages/A01La_Jolla1.html', 925, 690;
pages[1] = 'Photopages/A02La_Jolla2.html', 888, 650;
. . .
return pages;
}

这与 Flash 版本完美配合，但是当我尝试在 html 文件正文中应用该函数时:

<a href="javascript:void()#" onclick="openNewWindow(pages[currentSlideNum])"><img src="images/photosforswfs/La_Jolla_01.jpg" id="artwork" /></a>

它只会调用 html 图像文件，但不会遵循我设置的尺寸。窗口以与原始窗口相同的大小或小正方形打开，具体取决于浏览器。以下是 html 文档头部的 pages 变量的设置:

var pages = new Array();
pages = setupPages();

该数组还包含图像和标题，以相同的方式设置:

function setupSlides() {
var slides = new Array();

slides[0] = 'images/photosforswfs/La_Jolla_01.jpg'; 
...
return slides;
}

和

function setupCaptions() {
var captions = new Array();

captions[0] = '<br />Louis Karhn building in La Jolla, CA | 1';
...
return captions;
}

幻灯片放映设置如下:

var slides = new Array();
slides = setupSlides();

var captions = new Array();
captions = setupCaptions();

var currentSlideNum = 0;
var numSlides = slides.length;

function previousSlide() {
   if (currentSlideNum == 0) {
   currentSlideNum = numSlides-1;
   } else {
   currentSlideNum--;
   }
   var slideObj = document.getElementById('artwork');
   slideObj.src = slides[currentSlideNum];
   var captionObj = document.getElementById('caption');
   captionObj.innerHTML = captions[currentSlideNum];
}

function nextSlide() {
if (currentSlideNum == numSlides-1) {
   currentSlideNum = 0;
   } else {
   currentSlideNum++;
   }
   var slideObj = document.getElementById('artwork');
   slideObj.src = slides[currentSlideNum];
   var captionObj = document.getElementById('caption');
   captionObj.innerHTML = captions[currentSlideNum];
    }

我做错了什么？我是一个完全的新手，剪切和粘贴代码而不是编写代码。我尝试过的任何方法都无法解决问题。请帮忙! 简迪伊

Answer 1

您的pages[0]数组位置仅保存Photopages/A01La_Jolla1.html并返回最后一个值(690)。 如果您想在页面数组中包含所有数据，您可以将其设为对象或另一个数组:

pages[0] = ['Photopages/A01La_Jolla1.html', 925, 690];

这样您就需要请求 pages[0][1] 和 pages[0][2] 来获取尺寸。

另一种方法是使用对象:

pages[0] = {url:'Photopages/A01La_Jolla1.html', w:925, h:690};

这样您就必须请求:pages[0].w 和 pages[0].h

最后，当然，您需要稍微更改一下对函数的调用以指定 with ispages[0].w 等，但这很简单。

openNewWindow(pages[0].url, pages[0].w, pages[0].h);

或者您可以只发送数组项并让函数从内部提取信息:

function openNewWindow(page) { 
    var OpenWin = window.open(page.url, "Illustrationslideshow", "toolbar=no, menubar=no ,location=no, scrollbars=yes, resizable=yes, statusbar=no, width=" + page.w+ ", height=" + page.h+ ", top=" + (screen.height/2 - height/2) + ", left=" + (screen.width/2 - width/2) + "\""); 
}
openNewWindow(pages[0]);