dispatchEvent Metodu

dispatchEvent metodu, bir element üzerinde bir olayı simüle etmeye olanak tanır. Bunun ne işe yaradığı: kullanıcının bir düğmeye tıklamasını, bir formun gönderilme girişimini vb. taklit edebilirsiniz. Bu durumda, olay event.isTrusted özelliği dışında gerçek olandan hiçbir şekilde farklı olmayacaktır. Hatta standart olmayan (sizin tarafınızdan uydurulmuş) isimlere sahip olaylar oluşturabilir ve ardından doğru anda onları tetikleyebilirsiniz. Yöntem, olayın tetiklenmesi gereken öğeye uygulanır. Parametre olarak, yöntem new Event yapıcısı kullanılarak oluşturulmuş bir olayı (nesneyi) alır.

Sözdizimi

javascriptelement.dispatchEvent(event);

Örnek

Bir düğmemiz olduğunu varsayalım. Bu düğmeye tıklandığında bir mesaj görüntülenir. Fare düğmenin üzerine getirildiğinde, bu düğmenin üzerine tıklandığını düşünmesini sağlayalım:

html<button id="button">düğme</button>
javascriptlet button = document.querySelector('#button');

button.addEventListener('click', function() {
  alert('mesaj');
});

button.addEventListener('mouseover', function() {
  let clickEvent = new Event('click'); // bir olay oluştur
  this.dispatchEvent(clickEvent); // düğmeye tıklamayı simüle et
});

Результат:

Örnek

Kendi olaylarınızı (kendi adınızla) oluşturabilir ve ardından doğru anda onları tetikleyebilirsiniz. Düğmeye bir showMessage olayı bağlayalım ve fare üzerine getirildiğinde bu olayı başlatalım:

html<button id="button">düğme</button>
javascriptlet button = document.querySelector('#button');

button.addEventListener('showMessage', function() {
  alert('mesaj');
});

button.addEventListener('mouseover', function() {
  let showMessageEvent = new Event('showMessage'); // bir olay oluştur
  this.dispatchEvent(showMessageEvent); // olayın tetiklenmesini sağla
});

Результат: