css 删除单击该元素后的鼠标悬停和鼠标离开事件

qpgpyjmq  于 2022-12-15  发布在  其他
关注(0)|答案(1)|浏览(125)

我有一个输入框,我在其中切换鼠标悬停和鼠标离开事件的文本,但当我单击该框时,我想删除鼠标悬停效果,但单击后,它仍然更改鼠标悬停

onMouseOver() {
    this.placeHolder= 'text1';
}

onMouseOut() {
    this.placeHolder = 'text2';
}

onMouseFocus() {
    this.placeHolder ='text3';
}
hvvq6cgz

hvvq6cgz1#

有许多方法可以做到这一点。请参阅here一个可能的副本。
但我更喜欢简短的说法:

使用变量

clicked: boolean = false;

onClick() {
  if (!clicked) {
    // Do what you wanna do
    clicked = true; 
  } 
}

第二个使用html

// Code behind
clicked: boolean = false;

onClick() {
  // Do what you wanna do
  clicked = true; 
}

// HTML
<button (click)="!clicked ? onClick() : null">CLICK ME</button>

所以,是的,其他的方法也是可能的,比如removeEventListener和Angular的renderer2等等。但是这并不好。永远不要自己直接修改html。让Angular来做。

相关问题