jQuery-তে একক-বার ঘটনা

যখন আমরা off পদ্ধতি ব্যবহার করে ইভেন্ট আনবাইন্ডিং শিখছিলাম, আমরা নিম্নলিখিত কনস্ট্রাকশনটি ব্যবহার করেছিলাম:

$('li').on('click', function() {
	$(this).append('!');
	$(this).off('click', func);
});

প্রথমে আমরা on ব্যবহার করে একটি ফাংশন-হ্যান্ডলার সংযুক্ত করতাম, তারপর off ব্যবহার করে আনবাইন্ড করতাম।

jQuery-তে একটি সুবিধাজনক পদ্ধতি আছে one, যা একটি একক-বারের ইভেন্ট বাইন্ড করতে দেয় - এটি শুধুমাত্র একবার কার্যকর হবে, এবং তারপর স্বয়ংক্রিয়ভাবে আনবাইন্ড হয়ে যাবে। এই পদ্ধতিটি প্রথম প্যারামিটার হিসেবে ইভেন্টের ধরন নেয়, এবং দ্বিতীয়টি - সংযুক্ত ফাংশন।

নিম্নলিখিত HTML কোডের ভিত্তিতে আমরা পরবর্তী উদাহরণটি দেখব:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

CSS কোডটি এইরকম দেখাচ্ছে:

li {
	width: 100px;
	cursor: pointer;
}

এখন প্রতিটি li-তে আমরা একটি একক-বারের ইভেন্ট সংযুক্ত করি:

$('li').one('click', function() {
	$(this).append('!');
});

তালিকার আইটেমগুলিতে ক্লিক করুন। আপনি দেখতে পাচ্ছেন, আমরা one পদ্ধতির ধন্যবাদ একই প্রভাব পেয়েছি।

সমস্ত লিঙ্কে একটি ইভেন্ট সংযুক্ত করুন - লিঙ্কে হভার করলে তার টেক্সটের শেষে এর href বন্ধনীর মধ্যে যোগ করা হয়। লিঙ্কে প্রথমবার হভার করার পর এটি থেকে সেই ইভেন্টটি আনবাইন্ড করা উচিত, যা টেক্সটের শেষে href যোগ করে।

সমস্ত ইনপুটের জন্য এটি তৈরি করুন যাতে তারা যেকোনো একটিতে ক্লিক করলে তাদের নিজস্ব value প্রদর্শন করে, কিন্তু শুধুমাত্র প্রথম ক্লিকে। ইনপুটে পুনরায় ক্লিক করলে কোনো প্রতিক্রিয়া হওয়া উচিত নয়।

সংখ্যাসহ অনুচ্ছেদ দেওয়া আছে। একটি অনুচ্ছেদে ক্লিক করলে এটিতে যে সংখ্যা রয়েছে তার বর্গফল উপস্থিত হওয়া উচিত, কিন্তু শুধুমাত্র প্রথম ক্লিকে। একটি অনুচ্ছেদে ডাবল-ক্লিক করলে অনুচ্ছেদের সংখ্যা দ্বিগুণ হওয়া উচিত, কিন্তু সেও শুধুমাত্র প্রথমবারের জন্য।

অনুচ্ছেদ দেওয়া আছে। এটি তৈরি করুন যাতে প্রথম ক্লিকে একটি অনুচ্ছেদের শেষে '!' যোগ হয়, কিন্তু শুধুমাত্র প্রথম ক্লিকে।