Смена картинки при клике

#javascript #html #jquery

Как написать на Jquery функцию, которая будет при нажатии на иконку плюс (изображение
plus.gif) будет менять его на минус (изображение minus.gif) и наоборот? То есть при
нажатии на минус обратно возвращается изображению плюса.


    
Россия
        

            
Пейзажи
        
    


    

Ответы

Ответ 1

function imgsrc(img) {
  if ($(img).attr("src") == "img/plus.gif")
    $(img).attr("src", "img/minus.gif");
  else
    $(img).attr("src", "img/plus.gif");
}


Ответ 2

Ответ из области "никогда так не делайте, хоть это и работает" :D



$("#icon").click(function(){ 
    $(this).attr('src', $(this).attr('src').split('').reverse().join(""));
});







отсутствие толкового реверса строки напрочь убило всю идею  :(

зы: ответ шутка, если вдруг кто не поймет


Ответ 3

Почему бы не назначить стили в CSS и потом через Jquery менять класс?



$("#main").on('click', '#icon' ,function(){ 
    $(this).toggleClass('minus');
});
#icon {
    width: 10px;
    height: 20px;
    background: url(https://i.stack.imgur.com/iTWRf.png) 0 0 no-repeat;
    display: inline-block;
    background-size: 20px;    
}

/* не обязательное указание*/
#icon.plus {
  background-position: 0px 0; 
}

#icon.plus.minus {
  background-position: -10px 0;
}




li {
  list-style: none;
}


    

      
      
    Россия
        

            
Пейзажи
        
    





toggleClass - Добавляет или удаляет заданный класс(ы) по принципу переключателя (добавляет,
если элемент не содержит класса, и удаляет, если класс есть)