জেকুয়েরি :focus সিলেক্টর
সংজ্ঞা এবং ব্যবহার
:focus সিলেক্টরের মাধ্যমে যে এলিমেন্টগুলো বর্তমানে ফোকাস অবস্থায় আছে সেই এলিমেন্টগুলোকে সিলেক্ট করা হয়।
পরামর্শঃ এই সিলেক্টরটি প্রায়শই ট্যাগ এবং অন্যান্য সিলেক্টরের সাথে ব্যবহার করা হয়। যদি অন্য সিলেক্টর অথবা ট্যাগের সাথে ব্যবহার করা না হয় তবে এটি ("*:focus") হয়।
সিনট্যাক্স
$(":focus")
:focus সিলেক্টর সংক্রান্ত উদাহরণ
যেসকল এলিমেন্টে বর্তমানে ফোকাস অবস্থায় আছে সেগুলো সিলেক্ট
নিচের উদাহরণে :focus সিলেক্টরের ব্যবহার দেখানো হলোঃ
উদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<title>জেকুয়েরি :focus সিলেক্টর</title>
<style>
.focused {
background: yellow;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div id="content">
First Name : <input type="text"><br>
Last Name : <input type="tet2"><br>
District: <select>
<option>Dhaka</option>
<option>Rajshahi</option>
<option>Chandpur</option>
</select>
</div>
<script>
$("#content").delegate("*","focus blur",function() {
var elem = $(this);
setTimeout(function() {
elem.toggleClass("focused", elem.is(":focus"));
}, 0);
});
</script>
</body>
</html>
ফলাফল