我如何替换"echo ucwords($row2[mainImage1]);"在标签的href属性与"echo $row2[selectionThumb3];"从标签的src属性使用Javascript下面?
下面是我的代码: <img class="thumbNotSelected" src="../images/ThumbSelection/<?php echo $row2[selectionThumb3]; ?>.jpg" />
<div class="mainImage magnify">
<a href="../images/MainImage/<?php echo ucwords($row2[mainImage1]); ?>.jpg" rel="lightbox" title="<?=$row2[name]?>">
<img class="mainImage small" src="../images/MainImage/<?php echo $row2[mainImage1]; ?>.jpg" /></a>
</div>
添加当前Javascript:
$('#thumbs').delegate('img', {
click: function(){
$('.mainImage').attr('src',$(this).attr('src').replace('ThumbSelection','MainImage').replace('selectionThumb','mainImage')); //here I replace the src of the Main Image to match the selected thumbnail.
var $this = $(this),
index = $this.index();
$("#thumbs img").removeClass('thumbSelected');
$this.addClass('thumbSelected');
}});
用户可以点击几个拇指。主图像在点击拇指后加载相应的图片。然而,(用于灯箱)永远不会改变以适应新加载的图片,灯箱总是使用相同的图像,而不是用户点击的那个。谢谢!
$('.mainImage a').attr('href', $('.thumbNotSelected').attr('src'));
应该做你需要的
使用下面的js,您可以动态地将链接的href更改为加载图像的相同路径。让我知道它是否有效
$('#thumbs').delegate('img', {
click: function(){
$('.mainImage').attr('src',$(this).attr('src').replace('ThumbSelection','MainImage').replace('selectionThumb','mainImage'));
$('.mainImage a').attr('href',$(this).attr('src').replace('ThumbSelection','MainImage').replace('selectionThumb','mainImage'));
var $this = $(this),
index = $this.index();
$("#thumbs img").removeClass('thumbSelected');
$this.addClass('thumbSelected');
}});