জেকুয়েরি :selected সিলেক্টর
সংজ্ঞা এবং ব্যবহার
:selected সিলেক্টরের মাধ্যমে পূর্ব নির্ধারিত অপশন এলিমেন্টকে সিলেক্ট করা হয়। সাধারনত অপশন লিস্টে অনেক গুলো ভ্যালু থাকে। আমরা চাইলে selected এট্রিবিউটটি ব্যবহার করে একটি ভ্যালুকে পূর্ব থেকেই অপশন লিস্টের জন্য সিলেক্ট করে দিতে পারি। সেটিকে আলাদাভাবে হাইলাইট করার জন্য এই সিলেক্টরটি ব্যবহার করে স্টাইল প্রয়োগ করা হয়। নিচের উদাহরণটি লক্ষ্য করলে বিষয়টি ভালোভাবে বুঝতে পারবেন।
সিনট্যাক্স
$(":selected"):selected সিলেক্টর সংক্রান্ত উদাহরণ
একটি ড্রপডাউন লিস্টের পূর্ব-নির্ধারিত আইটেম সিলেক্ট
নিচের উদাহরণে :selected সিলেক্টরের ব্যবহার দেখানো হলোঃ
উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<title>জেকুয়েরি :selected সিলেক্টর</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(":selected").css({
"background-color": "yellow",
"color": "red",
});
});
</script>
</head>
<body>
<form>
Name: <input type="text" name="user"><br>
Your Device:
<select>
<option>Computer</option>
<option selected="selected">Laptop</option>
<option>Mackbook</option>
<option>Mobile</option>
<option>Tab</option>
</select>
</form>
</body>
</html>
ড্রপডাউন লিস্টটি ক্লিক করুন এবং অপশন গুলোর উপর মাউস হোভার-ওভার করুন।
ফলাফল