কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে ইভেন্ট হ্যান্ডলার কী?


জাভাস্ক্রিপ্টের HTML-এর সাথে ইন্টারঅ্যাকশন ঘটে ইভেন্টের মাধ্যমে, যা ব্যবহারকারী বা ব্রাউজার পেজ ম্যানিপুলেট করলে ঘটে।

যখন পেজ লোড হয়, সেটিই একটি ইভেন্ট। ব্যবহারকারী বাটনে ক্লিক করলে সেই ক্লিকটিও একটি ইভেন্ট। অন্যান্য উদাহরণে রয়েছে: কী চাপা, উইন্ডো বন্ধ করা, উইন্ডো রিসাইজ করা ইত্যাদি।

উদাহরণসমূহ

onclick ইভেন্ট টাইপ

এটি সবচেয়ে বেশি ব্যবহৃত ইভেন্ট টাইপ, যা ঘটে যখন ব্যবহারকারী তার মাউসের বাম বাটনে ক্লিক করে। আপনি এই ইভেন্ট টাইপের বিরুদ্ধে ভ্যালিডেশন, সতর্কতা ইত্যাদি রাখতে পারেন।

নিচের উদাহরণটি চেষ্টা করুন।

<html> 
  <head> 
    <script> 
      <!-- 
        function sayHello() { 
          alert("Hello World") 
        } 
      //--> 
    </script> 
  </head> 
  <body> 
    <p>নিচের বাটনে ক্লিক করুন এবং ফলাফল দেখুন</p> 
    <form> 
      <input type="button" onclick="sayHello()" value="Say Hello" /> 
    </form> 
  </body> 
</html>

onmouseover এবং onmouseout

এই দুটি ইভেন্ট টাইপ ছবি বা টেক্সটের সাথে সুন্দর ইফেক্ট তৈরি করতে সাহায্য করে। onmouseover ইভেন্টটি ট্রিগার হয় যখন আপনি যেকোনো এলিমেন্টের ওপর মাউস নিয়ে যান, আর onmouseout ট্রিগার হয় যখন আপনি সেটি থেকে মাউস সরিয়ে নেন। নিচের উদাহরণটি চেষ্টা করুন।

<html> 
  <head> 
    <script> 
      <!-- 
        function over() { 
          document.write("Mouse Over"); 
        } 
        function out() { 
          document.write("Mouse Out"); 
        } 
      //--> 
    </script> 
  </head> 
  <body> 
    <p>ফলাফল দেখতে ডিভিশনের ভিতরে মাউস নিয়ে যান:</p> 
    <div onmouseover="over()" onmouseout="out()"> 
      <h2> এটি ডিভিশনের ভিতরে </h2> 
    </div> 
  </body> 
</html>
  1. জাভাস্ক্রিপ্টে onkeydown ইভেন্ট কী?

  2. জাভাস্ক্রিপ্টে onmouseup ইভেন্ট কী?

  3. জাভাস্ক্রিপ্টে ইভেন্ট কী?

  4. জাভাস্ক্রিপ্টে প্রমিস (Promises) কী?