onclick setAttribute href from a src
I'm working on a project to swap thumbnail images to a larger image when the thumbnail is selected and it's working ok however, I would now like the end users to be able to click on the larger image to show it in jquery.lightbox-0.5. The problem is that after selecting the thumbnail the loaded image does not have a href. I was hoping that I could pass the images src to the href using an onclick event, but I can't figure out how to make this work.
Here's my code
<script type="text/javascript">
function swaphref(image) {
document.getElementById('image').setAttribute('href', this.src);
//window.alert(document.getElementById('image').src);
}
</script>
<body>
<div class="productimage" id="gallery"><a onclick="swaphref(this)"><img id="image" img src="product_images/<?php echo $targetID; ?>/<?php echo $targetID; ?>.jpg" width="253" height="378" border="0" /></a></div>
<开发者_如何学运维/body>
Ok. I got this working. The 'a' was missing an id.
Here's the code.....
<script type="text/javascript">
function swaphref(imagehref) {
document.getElementById('imagehref').setAttribute('href', image.src);
//window.alert(document.getElementById('image').src);
//window.alert(document.getElementById('imagehref').href);
}
</script>
<body>
<div class="productimage" id="gallery"><a href="#" id="imagehref" onclick="swaphref(this)"><img id="image" img src="product_images/<?php echo $targetID; ? >/<?php echo $targetID; ?>.jpg" width="253" height="378" border="0" /></a></div>
</body>
Thank you to everyone who tried to help.
I think you're confusing the href
and src
attributes. Looking at your code I see two things:
document.getElementById('image').setAttribute('href', this.src); //window.alert(document.getElementById('image').src);
You're setting the image's href-attribute, which should src, and your getting the src-attribute from the link, which should be href. The odd thing is that your correct in the window.alert
So:
document.getElementById('image').setAttribute('src', this.href'); window.alert(document.getElementById('image').src
Should work.
var image = document.getElementById('image');
image.setAttribute('href', image.src);
Should work.
change this line
document.getElementById('image').setAttribute('href', this.src);
to this way
document.getElementById('image').setAttribute('src', this.href);
精彩评论