Используйте функцию стабилизации, чтобы DIV исчезал при перемещении мыши.
Поскольку сам тег div не поддерживает событие onblur, для элемента div, который всплывает при нажатии кнопки, мы хотим, чтобы он исчезал, когда элемент div теряет фокус, и этого нельзя добиться с помощью onblur.
Но вы можете использовать onmouseout и события, чтобы реализовать функцию потери фокуса и исчезновения DIV. Может возникнуть проблема с непосредственным использованием onmouseout для реализации удаления и исчезновения: если положение вашей кнопки и положение всплывающего div не совпадают, событие onmouseout будет запущено немедленно при движении мыши, что бесполезно.
Используйте комбинацию функций стабилизации, onmouseout и onmouseover, чтобы добиться эффекта размытия с хорошим восприятием.
/** *Мышь перемещается по событию div*/ function moveOverEvent(ele,outTimer) { let overTimer = null return function(){clearTimeout(outTimer); //Если элемент div не исчезает, переместите элемент div, затем очистите его. последнее удаленное событиеclearTimeout(overTimer); //Антитряска overTimer = setTimeout(()=>{ ele.style.display = block; },500); /** *); Мышь выдвигается*/ function moveOutEvent(ele,outTimer) { return function(){clearTimeout(outTimer) //Защита от сотрясений outTimer = setTimeout(()=>{ //Подождите 500 мс после перемещения, затем исчезнем этот элемент div; .style .display = нет },500; } });
Затем я случайно обнаружил, что событие размытия можно реализовать, добавив атрибут tabindex в div, так что приведенный выше код, возможно, был написан зря. (PS Я думаю, что описанный выше опыт будет лучше и уменьшит количество случайных касаний)
//После того, как tabindex установлен, элемент по умолчанию добавит пунктирную линию и удалит ее через ouline=0 (IE устанавливает displayfocus=true) <div tabindex=0 Outline=0idefocus=true></div>
Выше приведено все содержание этой статьи. Я надеюсь, что она будет полезна для изучения всеми. Я также надеюсь, что все поддержат сеть VeVb Wulin.