У меня проблема с событием mouseleave: когда я впервые загружаю страницу, событие mouseleave работает просто отлично, но когда я нажимаю на searchBar (click click), затем щелкаю снаружи (blur blur), остановка mouseleave останавливаетсяработает после следующего зависания (событие при наведении курсора мыши), т. е. панель поиска не сжимается (и консоль не печатает «уходя»)
HTML-код
<input type="text" id="searchBar" title="Chercher un projet" (mouseover)="handleHover()" (mouseleave)="handleLeave()" (click)="handleClick()" (blur)="handleBlur()" >
машинописный код
export class NavBarComponent implements OnInit {
isFocused: boolean;
constructor(public router: Router) {
}
ngOnInit() {
this.isFocused = false;
}
goTo(url: string) {
this.router.navigate(['/' + url]);
}
handleLeave(){
if(!this.isFocused) {
$('#searchBar').stop(true, false);
console.log("leaving");
$('#searchBar').animate({width: 0}, 800);
}
}
handleHover(){
console.log("hovering");
console.log($('#searchBar').is(':hover'));
$('#searchBar').animate({width: 117}, 800);
}
handleClick(){
this.isFocused = true;
}
handleBlur(){
var s = (<HTMLInputElement>document.getElementById("searchBar")).value;
if(s === ""){
$('#searchBar').stop(true, false);
console.log("blurring")
$('#searchBar').animate({width: 0}, 800);
}
}