Question

我有一些带网址的图片。每个id都有自定义值。例如：id =＆＃34; bg_234＆＃34;。

<a href="" title="Switch" class="menulink">
<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg_234" /></a>

<a href="" title="Switch" class="menulink">
<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg_34444" /></a>

如何使用自定义ID值运行下面的函数？

$(function() {
 $('.menulink').click(function(e){
     e.preventDefault();
   $("#bg").attr('src',"http://placehold.it/333/3ef/img/picture1.jpg");
 });
});

尊敬的

Answer 1

不是按ID重新选择元素，而是使用$(this)来引用当前点击的元素，而不是简单地执行.find('img')来获取图片元素：

$(function() {
    $('.menulink').click(function(e){
        e.preventDefault();
        $(this).find('img').attr('src',"http://placehold.it/333/3ef/img/picture1.jpg");
    });
});

如果由于某些原因仍需要ID，请使用$(this).attr('id')

Answer 2

$(function() {
  $('.menulink').click(function(e) {
  e.preventDefault();  
  var $anchor =  $(this); //$(this) to refer to currently clicked element which has ".menulink" class
  $anchor.find('img[id^="bg_"]').attr('src',"http://placehold.it/333/3ef/img/picture1.jpg");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="" title="Switch" class="menulink">
<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg_234" /></a>

<a href="" title="Switch" class="menulink">
<img src="http://placehold.it/333/fe3/img/picture2.jpg" id="bg_34444" /></a>

如何使用参数

2 个答案: