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

查看:100
本文介绍了单击图像以使用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文件夹中)
redirect页面名称: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.

谢谢,
Raaks

Thanks, Raaks

推荐答案

也许这就是你想要的?

<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....

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆