ইভেন্ট তৈরি এবং ট্রিগার করা

এই আর্টিকেলে ইভেন্ট তৈরি এবং ডিসপ্যাচ করার প্রক্রিয়া দেখানো হয়েছে।

কাস্টম ইভেন্ট

ইভেন্ট তৈরি করা

নিচের মত করে Event কন্সট্রাক্টর এর সাহায্যে ইভেন্ট তৈরি করা যেতে পারে।

var event = new Event('build');

// Listen for the event.
elem.addEventListener('build', function (e) { ... }, false);

// Dispatch the event.
elem.dispatchEvent(event);

কনস্ট্রাক্টরটি অধিকাংশ আধুনিক ব্রাউজারে (ইন্টারনেট এক্সপ্লোরার ব্যতীত) সমর্থিত। আরেকটি পদ্ধতি হল পুরনো পদ্ধতি।

কাস্টম ডাটা যোগ করা – CustomEvent

To add more data to the event object, the CustomEvent interface exists. For example, the event could be created as follows:

var event = new CustomEvent('build', { 'detail': elem.dataset.time });

This will then allow accessing the additional data in the event listener:

function eventHandler(e) {
  log('The time is: ' + e.detail);
}

পুরনো পদ্ধতি

The older approach to creating events uses APIs inspired by Java. The following shows an example:

// Create the event.
var event = document.createEvent('Event');

// Define that the event name is 'build'.
event.initEvent('build', true, true);

// Listen for the event.
document.addEventListener('build', function (e) {
  // e.target matches document from above
}, false);

// target can be any Element or other EventTarget.
document.dispatchEvent(event);

বিল্ট-ইন ইভেন্ট ট্রিগার করা

This example demonstrates simulating a click (that is programmatically generating a click event) on a checkbox using DOM methods. You can view the example in action here.

function simulateClick() {
  var event = new MouseEvent('click', {
    'view': window,
    'bubbles': true,
    'cancelable': true
  });
  var cb = document.getElementById('checkbox'); 
  var canceled = !cb.dispatchEvent(event);
  if (canceled) {
    // A handler called preventDefault.
    alert("canceled");
  } else {
    // None of the handlers called preventDefault.
    alert("not canceled");
  }
}