Изменение изображений несколько раз, нажав в HTML с JavaScript - PullRequest
Новая
       6

Изменение изображений несколько раз, нажав в HTML с JavaScript

0 голосов
/ 04 сентября 2018

Мне нужна программа на HTML с javascript, в которой есть две картинки, которые при нажатии переключаются с картинки A на B и с картинки B на A и так далее. Я думаю, что мне нужна петля ...

Ответы [ 2 ]

0 голосов
/ 04 сентября 2018

хороший пример того, что вы хотите сделать здесь: https://www.w3schools.com/js/tryit.asp?filename=tryjs_intro_lightbulb

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

<script>
   function ChangeImage(){
   var picElement1 = document.getElementById('HTMLImgElement1');
   var picElement2 = document.getElementById('HTMLImgElement2');
   var temp = picElement1.src;
   picElement1.src = picElement2.src;
   picElement2.src = temp;
}
</script>

В html просто установите 2 изображения с идентификатором HTMLImgElement1 и HTMLImgElement2. и кнопка с атрибутом onclick, который будет перенаправлять на эту функцию.

0 голосов
/ 04 сентября 2018

Пожалуйста, попробуйте следующий код 

function changeImage() {
    var image = document.getElementById('myImage');
    if (image.src.match("bulbon")) {
        image.src = "pic_bulboff.gif";
    } else {
        image.src = "pic_bulbon.gif";
    }
}
<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">
<p>Click the light bulb to turn on/off the light.</p>

Вы можете иметь пример здесь https://www.w3schools.com/js/tryit.asp?filename=tryjs_lightbulb

...