Simulating Mouseover in JavaScript: Challenges with CSS :hover
Attempting to simulate a mouseover event in JavaScript to activate the CSS ":hover" property can prove challenging, as demonstrated by the following query:
Question:
I've been attempting to simulate a mouseover event using a mouseover listener in Chrome. While the listener is triggered, the :hover declaration remains inactive. I tried manually adding a "hover" class, but it failed to alter the element's appearance. Is it possible to accomplish this?
Answer:
残念ながら、この方法は不可能です。マウスオーバーは信頼されたイベントではありません。
ユーザーエージェントによって生成されるイベント(ユーザーとのインタラクションの結果か、DOM の変更の直接の結果)は、スクリプトによって DocumentEvent.createEvent("Event") メソッドで生成されたイベント、Event.initEvent() メソッドで変更されたイベント、または EventTarget.dispatchEvent() メソッドでディスパッチされたイベントに与えられない特権を持つ信頼されたイベントです。信頼されたイベントの isTrusted 属性は true の値を持ち、信頼できないイベントの isTrusted 属性は false の値を持ちます。
信頼できない大部分のイベントは、クリックまたは DOMActivate イベントを除いて、既定のアクションをトリガーしません。
したがって、mouseover/mouseout イベントでクラスを手動で追加し、削除する必要があります。
以上がJavaScript は CSS :hover 効果を確実にシミュレートできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。