使用jquery动态更改图像的href路径

Dynamically Change the href path of image using jquery

本文关键字：href 路径 图像 jquery 动态 使用      更新时间：2023-09-26

我不确定是否可能，但如果可能的话，有熟人建议我。

例如：

<a href="image/image.jpg"><img src="image/image.jpg" alt="image"/></a>

在本文中，如何使用jquery动态地将href路径更改为另一个图像。即

<a href="image/img.jpg"><img src="image/image.jpg" alt="image"/></a> like this.

编辑：如果

<a href="#"><img src="image/image.jpg"/></a>
<a href="http://stackoverflow.com"><img src="image/image.jpg"/></a>
<a href="image/image.jpg"><img src="image/image.jpg"/></a>

我如何改变这个href attr，只有当href链接的锚标记包含图像时，这个条件才应该满足。则锚文本应该是CCD_ 2标签。

这是JSFIDDLE:http://jsfiddle.net/HMsSE/9/任何建议都将不胜感激。

谢谢，vicky

您可以尝试使用.attr()函数将href设置为新值：

$('a[href="image/image.jpg"]').attr('href', 'image/img.jpg');

当然，如果你给锚一个唯一的id:，这可能会更容易

<a href="image/image.jpg" id="myLink"><img src="image/image.jpg" alt="image"/></a>

这样你就可以更容易地选择它：

$('#myLink').attr('href', 'image/img.jpg');

您也可以尝试使用.prop()

$('a').prop('href', 'image/img.jpg')

根据您的评论，当a标记具有子元素img时，您正试图更改它的href。如果是，

if($('a').find('img').length) {  // it return the no. of img tag within a
   $('a').prop('href', 'image/img.jpg');
}

只需使用attr函数

$('a').attr('href','image/img.jpg');

你也可以通过id来更改它，这将是更有用的

<a id="myLink" href="image/image.jpg"><img src="image/image.jpg" alt="image"/></a>
$('#myLink').attr('href','image/img.jpg');

当主题启动时，更改在图像点击时执行

$('img').click(function() {
    $(this).parent('a').attr("href","image/img.jpg");
});

如果你也想检查href，你必须使用条件

$('a').click(function() {
    event.preventDefault();
    if ($(this).attr('href').search('jpg')!=-1)
        $(this).attr("href","image/img.jpg");
});

另外，我必须提到<a>中的<img>并不总是对点击做出响应

哦，是的，小提琴UPD我不知道我怎么会忘记过滤器

$('a').click(function() {
    event.preventDefault();
    $(this).filter('[href*=jpg],[href*=png],[href*=gif]').attr("href","image/img.jpg");
});

新的较短演示

您也可以在不包含jQuery 的本地Javascript中执行此操作

element.setAttribute（attributename，attributevalue）

希望这对你有帮助。

相关文章：