2013-06-24 3 views
0

Я художник пытается научиться программированию для нового проекта/Удалить MouseOut после заданного количества предупреждений в JavaScript

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

<!DOCTYPE html> 
<html> 
<head> 
</head> 

<body> 

    <div id="message"> 
    <input type="button" value="CLICK HERE" id="countButton" /> 

    <p style="color: white">The button was pressed <span id="displayCount">0</span> times.</p> 
    </div> 
    <script type="text/javascript"> 
     var count = 0; 
     var button = document.getElementById("countButton"); 
     var display = document.getElementById("displayCount"); 



     button.onclick = function(){ 
     count++; 
     display.innerHTML = count; 

     if (count <=3){ 
      button.onmouseout = function() { 
      alert("  Come on... BACK TO WORK!"); 
      } 
     } 

     else if(count>3){ 
     document.body.innerHTML="" 
     alert("FINALLY!!!"); 
} 
     } 
    </script> 
</body> 
</html> 

Это более короткая версия программы. Вы можете увидеть окончательный результат (минус ошибка мыши) по ссылке ниже: http://www.esmeraldakosmatopoulos.com/blank#!/c1fam Предупреждение: это довольно раздражает ... с целью.

Помогите мне

Спасибо!

+0

В чем проблема с этим кодом? – Sergio

ответ

0

Основная проблема здесь в части кода else. Он повторно привязывает обработчик mouseout при каждом нажатии кнопки, а count <= 3.

Вам необходимо переместить button.onmouseout = {...} из обработчика onclick, а затем в else положить button.onmouseout = null;.

Однако я предлагаю вам использовать addEventListener() вместо свойств события. Чтобы удалить слушателя, вы можете использовать removeEventListener() Таким образом, у вас будет лучший контроль над обработкой событий.