জেকুয়েরি focusin() মেথড
সংজ্ঞা এবং ব্যবহার
যখন একটি এলিমেন্ট (অথবা এর ভেতরের কোন এলিমেন্ট) ফোকাস হয়, তখন focusin ইভেন্টটি ঘটে।
একটি এলিমেন্ট বা তার ভেতরের কোন এলিমেন্টে focus ইভেন্ট ঘটলে focusin() মেথড রান হওয়ার জন্য একটি ফাংশন যোগ করে দেয়।
টিপস: মাউস ক্লিক অথবা ট্যাবের মাধ্যমে একটি এলিমেন্টকে সিলেক্ট করলে তা ফোকাস পায়।
টিপস: এই মেথডটি প্রায়ই focusout() মেথডের সাথে একত্রে ব্যবহার করা হয়।
সিনট্যাক্স ও ব্যাখ্যা
$(selector).focusin(function)
প্যারামিটার ও তাদের ভ্যালু
নিচের টেবিলে focusin() মেথডে ব্যবহৃত প্যারামিটার এবং প্যারামিটারের সম্ভাব্য ভ্যালু গুলো দেখানো হলোঃ
| প্যারমিটার | বিবরণ |
|---|---|
| function | আবশ্যক। focusin ইভেন্ট ঘটলে যে ফাংশন রান হবে তা নির্দেশ করে। |
focusin()মেথড সংক্রান্ত উদাহরণ
একটি <div> এলিমেন্ট অথবা তার যেকোন চাইল্ড এলিমেন্টকে ফোকাস করলে <div> এলিমেন্টের ব্যাকগ্রাউন্ড কালার পরিবর্তন:
উদাহরণঃ
<!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(){
$("div").focusin(function(){
$(this).css("background-color", "#FFFFCC");
});
$("div").focusout(function(){
$(this).css("background-color", "#FFFFFF");
});
});
</script>
</head>
<body>
<div style="border: 1px solid black;padding:10px;">
নাম: <input type="text"><br>
বয়স: <input type="number">
</div>
<p>ফোকাসের জন্য ইনপুট ফিল্ডে ক্লিক করুন। ফোকাস সরানোর জন্য ইনপুট ফিল্ডের বাইরে ক্লিক করুন।</p>
</body>
</html>
ফলাফল