Question

<ul class="slides">
<li class="slide" data-slide="1">
    <img src="smiley1.gif" alt="Smiley face1">
</li>
<li class="slide selected" data-slide="2">
    <img src="smiley2.gif" alt="Smiley face2">
</li>
</ul>

如何使用Jquery添加指向所选图像的链接（类：幻灯片选择）？

Answer 1

您可以使用jQuery和wrap()函数遍历列表中的所有图像并在其周围添加链接，以下示例将导航到图像本身。

$(document).ready(function(){
    $('.selected img').each(function(){
        $(this).wrap('<a href="' + $(this).attr('src') +'"></a>');
    })
})

如果您要添加指向其他网页/网站的链接，请将$(this).wrap('<a href="' + $(this).attr('src') +'"></a>')替换为$(this).wrap('<a href="www.google.com"></a>')，如下所示

$(document).ready(function(){
    $('.selected img').each(function(){
        $(this).wrap('<a href="www.google.com"></a>');
    })
})

如果您想在点击图片后使用javascript导航到其他网站，则可以在点击事件上设置window.location.href

$(document).ready(function(){
    $('.selected img').click(function(){
        window.location.href='www.google.com';
    })
})

如何使用Jquery添加图像链接？

1 个答案: