জেকুয়েরি change() মেথড
সংজ্ঞা এবং ব্যবহার
একটি এলিমেন্টের ভ্যালু পরিবর্তন করলে change ইভেন্ট ঘটবে (শুধুমাত্র <input>, <textarea> এবং <select> এলিমেন্টে কাজ করে)।
change() মেথড change ইভেন্ট ট্রিগার করে, অথবা change ইভেন্ট ঘটলে রান করার জন্য একটি ফাংশন সংযুক্ত করে।
নোট: মেন্যু সিলেক্টের জন্য একটি অপশন সিলেক্ট করলে change ইভেন্ট ঘটে। টেক্সট ফিল্ড অথবা টেক্সট এরিয়ার জন্য কন্টেন্ট পরিবর্তন করার পর ফিল্ডটি ফোকাস হারালে change ইভেন্টটি ঘটে।
সিনট্যাক্স ও ব্যাখ্যা
$(selector).change()
প্যারামিটার ও তাদের ভ্যালু
নিচের টেবিলে change() মেথডে ব্যবহৃত প্যারামিটার এবং প্যারামিটারের সম্ভাব্য ভ্যালু গুলো দেখানো হলোঃ
| প্যারামিটার | বিবরণ |
|---|---|
| function | ঐচ্ছিক। change ইভেন্ট ঘটলে যে ফাংশনটি রান হবে সেটিকে নির্দেশ করে |
change() মেথড সংক্রান্ত উদাহরণ
উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<title>জেকুয়েরির উদাহরণ</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("input").change(function(){
alert("টেক্সট পরিবর্তন করা হয়েছে।");
});
});
</script>
</head>
<body>
<input type="text">
<p> ইনপুট ক্ষেত্রের মধ্যে কিছু লিখুন তারপর ফিল্ডের বাইরে এন্টার বাটনে ক্লিক করুন</p>
</body>
</html>
ফলাফল
এলিমেন্ট বদলানোর পর একটি ফাংশন যুক্ত করা
উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<title>জেকুয়েরির উদাহরণ</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".field").change(function(){
$(this).css("background-color", "#D6D6FF");
});
});
</script>
</head>
<body>
<p>এলিমেন্ট বদলানোর পর একটি ফাংশন যুক্ত করুনঃ</p>
<div>
<p>আপনার নাম লিখুন: <input class="field" type="text"></p>
<p>ইনপুট ফিল্ডে কিছু লিখুন, তারপর এন্টার বাটন চাপুন অথবা বাইরে ক্লিক করুন।</p>
</div>
</body>
</html>
ফলাফল