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

HTML onchange ইভেন্ট অ্যাট্রিবিউট


HTML onchange অ্যাট্রিবিউটটি ট্রিগার হয় যখন আপনি একটি HTML এলিমেন্টের মান পরিবর্তন করেন একটি HTML ডকুমেন্টে।

সিনট্যাক্স

নিচে সিনট্যাক্স দেওয়া হলো:

<tagname onchange=”script”></tagname>

উদাহরণ

HTML onchange ইভেন্ট অ্যাট্রিবিউটের একটি উদাহরণ দেখা যাক:

<!DOCTYPE html> <html> <head> <style>    body {       color: #000;       height: 100vh;       background-color: #FBAB7E;       background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);       text-align: center;       padding: 20px;    }    .show {       font-size: 1.1rem;       margin: 1rem auto;    }    select {       height: 2rem;       width: 30%;       font-size: 1rem;       background: transparent;       border: 2px solid #fff;       outline: none;    } </style> </head> <body> <h1>HTML onchange ইভেন্ট অ্যাট্রিবিউট ডেমো</h1> <p>আপনার প্রিয় বিষয় সিলেক্ট করুন:</p> <select onchange="get()"> <option>পদার্থবিজ্ঞান</option> <option>রসায়নবিজ্ঞান</option> <option>গণিত</option> </select> <div class="show"></div> <script>    function get() {       var msg = document.querySelector('.show');       msg.innerHTML = "বর্তমান মান " + document.querySelector("select").value;    } </script> </body> </html>

আউটপুট

HTML onchange ইভেন্ট অ্যাট্রিবিউট

এখন ড্রপ-ডাউন লিস্টের মান পরিবর্তন করুন onchange ইভেন্ট কীভাবে ট্রিগার হয় তা পর্যবেক্ষণ করার জন্য।

HTML onchange ইভেন্ট অ্যাট্রিবিউট


  1. HTML ondragleave ইভেন্ট অ্যাট্রিবিউট

  2. HTML ondragenter ইভেন্ট অ্যাট্রিবিউট

  3. HTML ondragend ইভেন্ট অ্যাট্রিবিউট

  4. HTML onpageshow ইভেন্ট অ্যাট্রিবিউট