7

入力ボックスでfocusイベントをトリガーすると、それ が呼び出されますが、UI では入力ボックスにフォーカスがありません。この動作には何か理由がありますか?dispatchEventonfocus

var test = document.getElementById("test");
test.onfocus = function(event) {
  console.log('focused');
}
var e = document.createEvent('Event');
e.initEvent("focus", true, true);
test.dispatchEvent(e);

一方、これは期待どおりに機能します。

var test = document.getElementById("test");
test.focus();

これを調査している理由は、ZeptoJS を使用してイベントをトリガーし、dispatchEvent.

4

1 に答える 1

7

イベントを発生させる要素は、そのイベントをリッスンしている必要はありません。潜在的に、親要素もそのイベントをリッスンしている可能性があるためです。

イベントを手動で起動しても、そのイベントに関連付けられたデフォルトのアクションは生成されないことに注意してください。たとえば、focusイベントを手動で起動しても要素はフォーカスを受け取りません（そのためにはそのfocus()メソッドを使用する必要があります）、submitイベントを手動で起動してもフォームは送信されません（submit()メソッドを使用）、キーイベントを手動で起動してもその文字は発生しませんフォーカスされたテキスト入力に表示され、リンクに対して手動でクリックイベントを発生させても、リンクはアクティブ化されません。UIイベントの場合、スクリプトがユーザーアクションをシミュレートできないため、セキュリティ上の理由から重要です。ブラウザ自体と相互作用します。

fireEvent()IEで作業している場合は、を使用する必要があることにも注意してください。dispatchEventまた、メソッドとメソッドの主な違いは、メソッドがイベントのデフォルトアクションを呼び出すのfireEventに対し、メソッドは呼び出さないことです。dispatchEventfireEvent

だから解決策のためにこれを試してみてください

test.onfocus = function(event) {
  console.log('focused');
  if( ! test.hasFocus() ) {
    test.focus();
  }
}
于 2011-07-05T05:13:03.477 に答える