0

我创建了一个 html 文件,其中包含所有照片和另一个 html 文件,其中我只看到 1 张全尺寸图像。现在,如果我单击第一个文件中的一个图像,我希望使用第一个文件中的他的 src 将这些图像打开到第二个 html 页面中,我想使用 javascript。(是的,我知道我可以创建 20 个 html 文件,每个文件都有不同的照片,但我只想使用 1 个 html 文件)

文件 1 = “index.html”:

 <a href="work_detail.html" ><img src="images/templatemo_image_01_big.jpg" alt="image" 
 width="100%" height="100%" id="pic1" onClick="hello();" /></a>

文件 2 =“work_detail.html”:

 <a target="_parent"><img src="" alt="product" id="work" /></a>

JavaScript:

 function hello(){
  var pic1 = document.getElementById('pic1').src;
 document.getElementById('work').src= pic1;
 }

如何使用 JavaScript 将第一个 id 与它们位于不同文件中的第二个 id 连接起来?

4

2 回答 2

0

我能想到的一种选择是让第二页接收图像的来源作为 url 参数。是一篇描述如何使用 javascript 读取 url 参数的帖子。

之后使用图像 src 并将其设置为第二个图像。顺便说一下,您将需要对 url 进行 url 编码。对于这样的编码使用encodeURIComponent

str = encodeURIComponent(imageSource);

您在接收页面中使用以下代码进行解码decodeURIComponent

str = decodeURIComponent(uri_encode);
于 2013-03-11T19:21:20.977 回答
0

考虑 PHP。

在php中它会像

将显示完整图像的页面为

<?php
$src= isset($_GET['src']) ? $_GET['src'] : "default_image_url.ext";
$alt= isset($_GET['alt']) ? $_GET['alt'] : "default_alt";
echo "<img src='$src' alt='$alt'>";

现在,在主 javascript 页面上,添加它

function GtU(url, alt){
 window.location.href="second_page.php?src="+url+"&alt="+alt;
}

在每个 img 标签中添加这个, <img src="source" alt="alt" onclick="GtU(this.src, this.alt)" > 实际上它是一个更好的方法......只是一点点服务器端的是必需的。也可以用饼干做,但会弄脏手

于 2013-03-11T19:37:37.800 回答