javascript - 单击时转到新样式页面的图像页面

Question

我是 JavaScript 和 jQuery 的新手，我对 HTML 和 CSS 相当了解。

我有一个包含 20 张最小化图片的页面(很快就会有 500 多张图片)，单击这些图片会打开一个新页面。

我在那里没有问题。我想要的是，当单击图片时，它会在已经设置样式的页面中打开，并且所选图片会放置在该页面的中央(或者我希望放置的位置)。

我知道我必须要携带图片id到新页面，但我完全不知道该用什么代码。这是我现在用来访问新页面的方法。

<img src="img/1.jpg" class="thumbnail" id="preview">

为了让这张图片在我正在使用的新窗口中打开

<script>
$(document).ready(function() {
    $('img.thumbnail').click(function() {
        window.location.href = this.id + '.html';
    });
});
</script>

此代码在另一个窗口中打开图像，但它没有样式，我想对其进行样式设置，并将任何选定的图像放在我选择的位置。

我不想为每张图片创建 500 多个页面，而且我知道我已经看到它完成了，我只是不知道该怎么做。

感谢您提供的任何帮助。

Answer 1

为什么不使用 jQuery 将 src 属性的值作为 querystring 传递给页面？

window.location.href = 'preview.html?src='+$(this).attr('src');

然后在preview.html 中，使用提供的函数用javascript 获取src 参数here .

示例:

var src = getParameterByName('src');

不过，如果您能够使用服务器端脚本，事情会简单得多。