ফোকাস-ইন এবং ফোকাস-আউট ইভেন্ট (Focusin and Focusout Event) : জে-কোয়েরী -(পর্ব-২৭)

যখন কোন element focus পায় (get focus) তখন focusin event সংগঠিত হয়। যখন selected element এর child element focus পায়, তখন focusin() methode কোন function কে call করতে পারে।
Syntax : $(selector).focusin(function(){})

focusout event টি focusin event এর ঠিক বিপরীত; যখন কোন element focus হারায় (losses focus) তখন focusout event সংগঠিত হয়। যখন selected element এর child element focus হারায়, তখন focusout() methode কোন function কে call করতে পারে। এটি bluer() methode এর মত কাজ করে।

Syntax : $(selector).focusout(function(){})

Example :

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(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;">
First name: <input type="text" /><br />
Last name: <input type="text" />
</div>
<p>Click outside the div to lose focus (blur).</p>
</body>
</html

Try Demo

লক্ষ্য করুন যখন TextBox এ focus in করে তখন div element টির background color হলুদ, আবার যখন focus loss করে তখন div element টির background color সাদা হচ্ছে।

………………………………………………………………………………
আলোকিত একটা সুন্দর সমৃদ্ধ পৃথিবী আমাদের প্রত্যেকেরই স্বপ্ন । আসুন আমাদের মেধা পরিশ্রম কে বিজ্ঞান সম্মতভাবে ব্যবহার করে, আমাদের স্বপ্ন পূরণে অংশ গ্রহণ করি। আজ এখানেই শেষ করলাম। “HAVE A GOOD PROGRAMMING”

জে-কোয়েরী ধারাবাহিক টিউটোরিয়ালঃ