打开大量图像到1个html页面中

我创建了一个html文件，其中包含所有照片和另一个html文件，我只在其中看到1个图像全尺寸。现在，如果我从第一个文件中单击一个图像，我希望使用他的src从第一个文件打开这个第二个html页面，我想要使用javascript。（是的，我知道我可以创建20个HTML文件，其中每个人都有不同的照片，但我希望只使用1 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; 
}

如何第一ID与第二id其中不乏连接在不同的文件使用JavaScript？

来源

2013-03-11 manuel.koliqi

我能想到的一个选择是让第二个页面以url参数的形式接收图像的源。 Here是一篇文章，描述如何使用javascript读取url参数。

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

str = encodeURIComponent(imageSource);

您解码在接收页面decodeURIComponent这样的：

str = decodeURIComponent(uri_encode);

来源

2013-03-11 19:21:20

它看起来太复杂了，我认为不是我要找的 – 2013-03-11 23:15:28

考虑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-11 19:37:37 Ronnie

不工作：\t

– 2013-03-11 23:13:20

因为您的元素在帖子表单下并且PHP脚本收到GET ..此外，在GtU被开除之前，A会获得优先权并加载该文件 – Ronnie 2013-03-12 04:33:27

已更新的帖子... – Ronnie 2013-03-12 04:34:04

打开大量图像到1个html页面中

回答

相关问题