如何使用jQuery根据锚标记切换图像？

我有一个缩略图图像列表。当用户点击一个小的缩略图图像时，它会交换它以显示完整的图像。我一直在试图获取锚标记名称，以便我可以爆炸值i。但我无法得到它的工作，有什么想法？如何使用jQuery根据锚标记切换图像？

我的javascript：

function swap(image) { 
    document.getElementById("main").src = image.href; 
}

我的HTML & PHP脚本：

<img id="main" src="images/main.jpg" width="226" height="226" alt="" /> 

<p><strong>Day <?php echo $i; ?>:</strong></strong><br /><?php echo $today[$i]; ?></p> 
</div> 
</div> 

<?php 
for($i=1; $i<$day; $i++) 
    { 
    echo'<a href="images/prevDay-'.$i.'.jpg" name="day-'.$i.'" onclick="swap(this); return false;">'; 
    echo'<img src="images/thumbDay-'.$i.'.jpg" width="50" height="50" alt="" title="thumbDay-'.$i.'.jpg" /></a> '; 
    } 
?>

来源

2010-02-02 NULL

你的代码实际上并没有任何jQuery。您正在使用document.getElementById（“main”），而不是$（“＃main”） – 2010-02-02 14:49:06

我想我可能需要声明另一个事件，以便第一个事件交换图像，而第二个事件会将我的锚标记名称。我确实包括了另一个这样的事件。（a href =“images/prevFeb-1.jpg？prevDay = 1”onclick =“swap（this）; getAnchorName（）; return false;”）不幸的是，当我点击交换图像时，一个不同的页面，而不是交换窗口。有任何想法吗？ – NULL 2010-02-02 15:30:10

你会更好给它一个ID代替或为好。

jQuery的访问则是（例如）：

$("#day-1")

或者没有jQuery的，只是用你的document.getElementById。

如果你真的想通过名字来得到它：

$("a[name='day-1']")

来源

2010-02-02 14:48:11

我想我可能需要声明另一个事件，以便第一个事件交换图像，而第二个事件会为我提供锚点标记名称。我确实包括了另一个这样的事件。（a.href =“images/prevFeb-1.jpg？prevDay = 1”onclick =“swap（this）; getAnchorName（）; return false;”）不幸的是，当我点击交换图像时，它进入了一个不同的页面，而不是交换窗口。有任何想法吗？ – NULL 2010-02-02 15:30:54

假设你属性类的“缩略图”的缩略图，你可以做

$(".thumbnail").click(function(){ 
    // $(this) refers to the clicked element 
    $("#main").attr("src", $(this).attr("href")) 

})

的使用注意事项attr()方法为getter和setter

// getter: 
$(selector).attr(attr_name) 

// setter 
$(selector).attr(attr_name, attr_value)

您的PHP可以重写n为：

// no need for <a> element 
<?php 
for($i=1; $i<$day; $i++) 
    { 
    echo'<img class="thumbnail" src="images/thumbDay-'.$i.'.jpg" width="50" height="50" alt="" title="thumbDay-'.$i.'.jpg" />'; 
    } 
?>

来源

2012-02-22 13:52:01

如何使用jQuery根据锚标记切换图像？

回答

相关问题