Изменить источник изображения

Question

Я хочу использовать изображение под названием #MapButtonImage как «кнопка», поэтому, когда кто-то нажимает на него, отображается div и изменяется источник #MapButtonImage. Я сделал это так, что он показывает DIV следующим образом:

$(window).load(function(){ 
    $("img#MapButtonImage").click(function(){ 
    $("div.MapMain").toggleClass('MapMainShow'); 
    }); 
}); 

При нажатии на кнопку в тот момент, он меняет класс карты дел до отображения: блока, то второй щелчок восходит к значение по умолчанию: none.

Но я не могу заставить его изменить источник изображения с помощью jQuery. Я следовал руководству, используя переключатель из двух функций с источником, как два изображения, которые я хочу, но он работает только с более ранней версией jQuery и не последним.

Изображение #MapButtonImage имеет оригинальный источник «ShowMapButton.jpg», и я хочу изменить его на «HideMapButton.jpg», когда он нажимается, а затем снова на «ShowMapButton.jpg» при повторном нажатии.

Цель состоит в том, чтобы включить его в качестве переключателя, чтобы отображать под ним карту div, а изображение отражает действие, которое будет выполнять кнопка (показать или скрыть).

Любая помощь будет принята с благодарностью, я совершенно новичок в этом и не могу понять, почему она не работает в последней версии, но делает это в предыдущем.

Answer 1

Попробуйте это:

$(window).load(function(){ 
    $("img#MapButtonImage").click(function(){ 
    $("div.MapMain").toggleClass('MapMainShow'); 

    if($("div.MapMain").hasClass('MapMainShow')) { 
     $(this).attr('src', 'HideMapButton.jpg'); 
    } else { 
     $(this).attr('src', 'ShowMapButton.jpg'); 
    } 
    }); 
});