onclick 使用 Javascript 在图像上导航到另一个页面 [英] onclick on a image to navigate to another page using Javascript

问题描述

我正在使用 Javascript 热身，所以我正在自己尝试一些东西.我正在寻找一个 onclick 函数，其中我的 index.html 页面中有缩略图，并且每当用户单击该图像时，他将被重定向到一个新页面，该页面再次显示该图像以及有关它的一些信息.现在我只使用纯 HTML 来做这件事.

I am getting warmed up with Javascript so I am trying something on my own. I am searching for a onclick function, where I have thumbnail images in my index.html page, and whenever a user clicks the image he will be redirected to a new page where the image is again displayed along with some information about it. Right now I am doing it using just plain HTML.

我想使用 javascript 导航到与用户单击的图像对应的页面.使用onclick可以做到吗?我的网页上有 10 多个图像，每次用户单击图像时，我都想获取该图像的 id 并将其重定向到新页面.新页面以图像名称命名.

I want to use javascript to navigate to the page corresponding to the image the user has clicked. Is that possible to do using onclick? I have more than 10 images on my webpage and each time a user clicks an image I want to get the id of that image and redirect it to the new page. The new page is named after the image name.

例如:图片名称:bottle.jpg(位于 images 文件夹中)重定向页面名称:bottle.html(位于主文件夹中)

For ex: image name: bottle.jpg (residing in the images folder) redirect page name: bottle.html (residing in the main folder)

<a href="bottle.html" id="bottle" ><img src="../images/bottle.jpg" alt="bottle" class="thumbnails" /></a>

任何有价值的信息将不胜感激！

Any valuable information will be appreciated!

如果在这个论坛的某个地方被问到，如果有人能给我那个链接会很有帮助.

If it is somewhere asked in this forum, it would be helpful if somebody can give me that link.

谢谢，拉克斯

推荐答案

也许这就是你想要的?

<a href="#" id="bottle" onclick="document.location=this.id+'.html';return false;" >
    <img src="../images/bottle.jpg" alt="bottle" class="thumbnails" />
</a>

请记住，没有启用 javascript 的任何人都无法导航到图像页面....

edit: keep in mind that anyone who does not have javascript enabled will not be able to navaigate to the image page....

这篇关于onclick 使用 Javascript 在图像上导航到另一个页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！