Изменить изображение при нажатии кнопки

Кажется, что он должен работать, но нет. Я не уверен, где проблема: либо я делаю это неправильно, либо, возможно, у меня синтаксическая ошибка. Я просто ничего не делаю. Я пытаюсь изменить текущее изображение при нажатии кнопки. Я новичок в Javascript, поэтому, пожалуйста, будьте нежны;) Спасибо!Изменить изображение при нажатии кнопки

<html> 
<script> 
function pictureChange() 
{ 
document.getElementById(theImage).src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"); 
} 
</script> 
<body> 
<img id="theImage" src="http://31.media.tumblr.com/18b5f8f0a00ad01e50f7ae2f513be52d/tumblr_msqcl4iwM01soh1p8o1_500.png"> 
<p><input type="button" id="theButton" value="click me!" onclick="pictureChange()"></p> 
</body> 
</html>

источник

2013-10-26 user2884447

Это то, что вы можете отлаживать самостоятельно. Посмотрите в [консоли ошибок JavaScript] (http://www.netmagazine.com/tutorials/javascript-debugging-beginners) и проверьте, что говорит об ошибке. – JJJ

Вы пропустили котировки в .getElementById('theImage')

function pictureChange() 
    { 
    document.getElementById('theImage').src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
    }

источник

2013-10-26 17:08:21 Roar

Добавить " в getElementById аргументу и удалить ) в конце линии:

<script> 
    function pictureChange() 
    { 
      document.getElementById("theImage").src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
    } 
</script>

http://jsfiddle.net/cDd8J/ - здесь. Оно работает.

theImage - это просто идентификатор элемента, а не переменный, поэтому его нужно поместить в кавычки.

источник

2013-10-26 17:08:43

Есть много способов, вы могли бы try.Calling функции, используя встроенные атрибуты или вызывать его с помощью идентификатора в вашем script.Here один,

theButton.onclick = function pictureChange() 
{ 
    document.getElementById("theImage").src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
}

Demo

источник

2013-10-26 17:13:44

Вы можете использовать встроенный HTML: <img src="img1.jpg" onclick="this.src='img2.jpg'"> работает лучше всего.

источник

2016-11-19 13:33:48 CoderKube

Изменить изображение при нажатии кнопки

ответ

Смежные вопросы