Почему не работает onmouseout в JS?

490
09 августа 2017, 21:33

var SendButt = document.getElementById("sendbutt"); 
 
  SendButt.onmouseover = function(e) { 
     console.log('мышка пришла'); 
     SendButt.disabled = true; 
  }; 
 
  SendButt.onmouseout = function(e) { 
    console.log('мышка ушла'); 
    SendButt.disabled = false; 
  }
<input id="ni" type="number" name="num" value=""><br> 
<button id="sendbutt" type="submit">Отправить</button>

Первое событие срабатывает, второе onmouseout уже нет... Потому что кнопку отключили? Или косяк в другом?

Answer 1

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

var SendButt = document.getElementById("sendbutt"); 
document.onmousemove = function(e){ 
    if(e.target == SendButt) 
        SendButt.disabled = true; 
    else 
        SendButt.disabled = false; 
}
<input id="ni" type="number" name="num" value=""><br> 
<button id="sendbutt" type="submit">Отправить</button>

Answer 2

В хроме всё глобальный объект, не знаю какие там спецификации браузера но вот так работает через дополнительный div c addEventListener

var Cover = document.getElementById("my"); 
var SendButt = document.getElementById("sendbutt"); 
 
Cover.addEventListener("mouseover", function(e) { 
     console.log('мышка пришла'); 
     SendButt.disabled = true; 
  }); 
 
Cover.addEventListener("mouseout", function(e) { 
    console.log('мышка ушла'); 
    SendButt.disabled = false; 
  }); 
  
#my{ 
  border: 1px solid black; 
}
<input id="ni" type="number" name="num" value=""><br> 
<div id="my"> 
  <button id="sendbutt" type="submit">Отправить</button> 
</div>

READ ALSO
Структура приложения PHP
PHP

Структура приложения PHP

ЗдравствуйтеХотелось бы попросить совета, как правильно организовать структуру приложения

 632
Запись в Google таблицы без API php
PHP

Запись в Google таблицы без API php

Есть задача - сделать запись в Googlespreadsheets через php без использования API

 457
Скрипт авторизации на сайте Vk.com
PHP

Скрипт авторизации на сайте Vk.com

Где можно найти актуальную версию php скрипта авторизации на сайте vkДело в том, что хочу попытаться сделать поиск через vk

 402
Subprocess + php + django. Подводные камни
PHP

Subprocess + php + django. Подводные камни

Есть очень сложный скрипт на php, написанный из разряда "кручу верчу обмануть хочу" - криптография - генератор лицензий софта

 424