Есть код
|
Код:
|
<html>
<head>
<title>Magic Hat</title>
<script src="jquery-1.9.0.js"></script>
<script language="JavaScript">
function showRabbit()
{
var hatImage = $("#topHat");
hatImage.attr("src", "rabbit-hat.gif");
var button = $("#hocusPocus");
button.attr("value", "Get back in that hat!");
button.on('click', hideRabbit);
}
function hideRabbit()
{
var hatImage = $("#topHat");
hatImage.attr("src", "tophat.gif");
var button = $("#hocusPocus");
button.attr("value", "Hocus Pocus!");
button.on('click', showRabbit);
}
</script>
</head>
<body>
<h1 align="center">Welcome to the DOM Magic Shop!</h1>
<form name="magic-hat">
<p align="center">
<img src="topHat.gif" id="topHat"/>
<br /><br />
<input type="button" value="Hocus Pocus!" id="hocusPocus" onClick="showRabbit();"/>
</p>
</form>
</body>
</html> |
По этому коду при нажатии на кнопку должна меняться и картинка и надпись на кнопке.
При первом запуске страницы при нажатии на кнопку запускается функция showRabbit, меняет картинку и текст кнопки.
Далее снова жмем и запускается функция hideRabbit, меняет картинку и текст кнопки.
И снова жмем кнопку уже ничего не происходит, хотя должна вызываться функция showRabbit. Консоль не выводит ошибку.