使用jquery从anchor onclick更改图像src？

我使用jquery弹出一个AddThis共享框，当我点击环绕图像的链接时。它效果很好。我使用jQuery代码是在这里：使用jquery从anchor onclick更改图像src？

 //added to show/hide add-this 
    $('a#slick-toggle').click(function() { 
     $('#atBox').toggle(100); 
     return false; 
    });

这是我的相关HTML：

<a id="slick-toggle" href="#" title="Share"> 
<img src="images/navicon/navicon4_off.gif" alt="share" id="share" class="img-swap"> 
</a>

这使得一个小盒子的div似乎有一些共享的图标。它按预期工作。

我想要做的也是当锚点标签被点击时，使锚点标签内的图像“开关”。不幸的是，我发现这样做的常规jQuery图像“onclick”脚本似乎并不奏效，大概是因为“链接”被点击，而不是图像？反正，我试图“合并”与图像通过执行以下操作交换剧本最初的剧本，但没有运气：

 $('a#slick-toggle').click(function() { 

     if ($('#share').attr("class") == "img-swap") { 
      this.src = this.src.replace("_off","_on"); 
     } else { 
      this.src = this.src.replace("_on","_off"); 
     } 
     $('.img-swap').toggleClass("on"); 


     $('#atBox').toggle(100); 
     return false; 
    });

它似乎没有什么事，我把在第三行，我不能永远让jquery认识到我指的是图像。我不断收到“无法调用方法”替换“未定义”的消息。我试过这个，$（'＃share'）和（'#share'），他们都给我同样的信息。我不太熟悉jquery，但是我在脚本中做了一些明显错误的操作，在锚点onclick事件中调用函数时引用图像标记？

谢谢！

来源

2010-11-01 neomech

只要注意是不合法的HTML。它应该是你应该永远记得关闭你的图片标签。 – 2010-11-01 17:08:05

@John - 这取决于你的DOCTYPE。 – 2010-11-01 17:11:54

感谢您的提示:)我实际上有结束标记，但它在代码整理过程中丢失了，当我发布时，因此人们不必看一堆多余的东西;） – neomech 2010-11-01 17:47:23

你需要找到里面的形象，因为你click处理程序是对包装它<a>，就像这样：

$('a#slick-toggle').click(function() { 
    var img = $(this).find("img")[0]; 
    if ($('#share').attr("class") == "img-swap") { 
     img.src = img.src.replace("_off","_on"); 
    } else { 
     img.src = img.src.replace("_on","_off"); 
    } 
    $('.img-swap').toggleClass("on"); 
    $('#atBox').toggle(100); 
    return false; 
});

可以切换了一点东西是这样的：

$('a#slick-toggle').click(function() { 
    var img = $('#share')[0], isSwap = img.className == "img-swap"; 
    img.src = isSwap ? img.src.replace("_off","_on") : img.src.replace("_on","_off"); 
    $('.img-swap').toggleClass("on"); 
    $('#atBox').toggle(100); 
    return false; 
});

来源

2010-11-01 17:06:38

这很好用。非常感谢超快速的帮助！：d – neomech 2010-11-01 17:48:41

另一种方法：尝试使用.children（）来选择当前点击的子元素

$(this).children('> img')

在这种情况下，图像是调用click函数的直接后代。

http://api.jquery.com/children/

来源

2010-11-01 22:32:42 Jnicola

使用jquery从anchor onclick更改图像src？

回答

相关问题