যখন কোন 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”
জে-কোয়েরী ধারাবাহিক টিউটোরিয়ালঃ
- জে-কোয়েরী কি ?
- JavaScript, AJAX এবং jQuery নিয়ে কিছু কথা
- জে-কোয়েরী কোডিং পদ্ধতি
- জে-কোয়েরী সিনট্যাক্স
- জে-কোয়েরী সেল্ফ এ্যাক্সিউটিং ফাংশন
- জে-কোয়েরী অবজেক্ট এ্যাস্কেসর
- জে-কোয়েরী সিলেক্টর সমূহ
- অল সিলেক্টর (All Selector)
- ক্লাস এবং আইডি সিলেক্টর
- ইলিমেন্ট এবং মাল্টিপাল সিলেক্টর
- এট্রিবিউট সিলেক্টর
- প্রিফিস্ক সিলেক্টর
- কন্টেইন্ডস্ সিলেক্টর
- ওয়ার্ড এবং এন্ড সিলেক্টর
- ইকুয়াল এবং নট ইকুয়াল সিলেক্টর
- স্টার্ট ওয়িথ এবং হ্যাজ সিলেক্টর
- মাল্টিপাল এট্রিবিউট সিলেক্টর
- এট্রিবিউট সিলেক্টর গুলি নিয়ে একটি ছোট project
- :হিডেন সিলেক্টর
- :ভিজিবল সিলেক্টর
- jQuery form selectors উদাহরন
- Dynamically add/remove textbox
- জে-কোয়েরী ইভেন্ট সমূহ
- ব্লুয়ার ইভেন্ট
- ফোকাস এবং চেঞ্জ ইভেন্ট
- সাবমিট এবং সিলেক্ট ইভেন্ট
- ফোকাস-ইন এবং ফোকাস-আউট ইভেন্ট