Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Странное поведение jquery

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Без описания
Поиск в теме | Версия для печати
lawer85
Отправлено: 09 Января, 2015 - 22:09:18
Post Id


Частый гость


Покинул форум
Сообщений всего: 189
Дата рег-ции: Янв. 2013  


Помог: 1 раз(а)
Есть код

CODE (htmlphp):
скопировать код в буфер обмена
  1. <html>
  2.  <head>
  3.   <title>Magic Hat</title>
  4.         <script src="jquery-1.9.0.js"></script>
  5.         <script language="JavaScript">
  6.    function showRabbit()
  7.         {
  8.      var hatImage = $("#topHat");
  9.           hatImage.attr("src", "rabbit-hat.gif");
  10.           var button = $("#hocusPocus");
  11.           button.attr("value", "Get back in that hat!");
  12.           button.on('click', hideRabbit);
  13.    }
  14.        
  15.         function hideRabbit()
  16.         {
  17.                 var hatImage = $("#topHat");
  18.                 hatImage.attr("src", "tophat.gif");
  19.                 var button = $("#hocusPocus");
  20.                 button.attr("value", "Hocus Pocus!");
  21.                 button.on('click', showRabbit);
  22.         }
  23.  </script>
  24.  </head>
  25.  
  26.  <body>
  27.   <h1 align="center">Welcome to the DOM Magic Shop!</h1>
  28.   <form name="magic-hat">
  29.    <p align="center">
  30.     <img src="topHat.gif" id="topHat"/>
  31.     <br />    <input type="button" value="Hocus Pocus!" id="hocusPocus" onClick="showRabbit();"/>
  32.    </p>
  33.   </form>  
  34.  </body>
  35. </html>


По этому коду при нажатии на кнопку должна меняться и картинка и надпись на кнопке.

При первом запуске страницы при нажатии на кнопку запускается функция showRabbit, меняет картинку и текст кнопки.

Далее снова жмем и запускается функция hideRabbit, меняет картинку и текст кнопки.

И снова жмем кнопку уже ничего не происходит, хотя должна вызываться функция showRabbit. Консоль не выводит ошибку.
 
 Top
RickMan
Отправлено: 09 Января, 2015 - 23:03:47
Post Id


Участник


Покинул форум
Сообщений всего: 1033
Дата рег-ции: Май 2012  


Помог: 30 раз(а)
http://jsfiddle[dot]net/gregurco/L6th6pwv/ - посмотри, я твою задачу как-то так решил. Но вообще, проблема была в том, что ты навешиваешь новые обработчики клика, при этом старые не убираешь, и после третьего нажатия там уже срабатывает несколько раз поочередно функции. И вообще, советую установить себе firebug и научиться дебажить js. Ну и пользоваться jsfiddle.
 
 Top
lawer85
Отправлено: 09 Января, 2015 - 23:39:53
Post Id


Частый гость


Покинул форум
Сообщений всего: 189
Дата рег-ции: Янв. 2013  


Помог: 1 раз(а)
У меня была мысль об удалении событий, но не все я учел. Теперь работает. Я обошелся без

$('#hocusPocus').on('click', showRabbit);
 
 Top
armancho7777777 Супермодератор
Отправлено: 10 Января, 2015 - 01:05:15
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
CODE (javascript):
скопировать код в буфер обмена
  1. var button = $("#hocusPocus"),
  2.     hatImage = $("#topHat"),
  3.     data = [
  4.         {img: "rabbit-hat.gif", val: "Get back in that hat!"},
  5.         {img: "tophat.gif",     val: "Hocus Pocus!"}
  6.     ],
  7.     toggle = function(){
  8.         data.reverse();
  9.         hatImage.attr("src", data[0]['img']);
  10.         button.attr("value", data[0]['val']);
  11.     };
  12.  
  13. // Предварительная загрузка картинок.
  14. $.each(data, function(i, item){
  15.     (new Image()).src = item['img'];
  16. });
  17.  
  18. toggle();
  19. button.click(toggle);
 
 Top
lawer85
Отправлено: 10 Января, 2015 - 11:41:34
Post Id


Частый гость


Покинул форум
Сообщений всего: 189
Дата рег-ции: Янв. 2013  


Помог: 1 раз(а)
Видимо сколько людей, столько и решений в программировании Улыбка
 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB