সিলেক্টর selected
সিলেক্টর :selected এমন এলিমেন্টগুলো নির্বাচন করে,
যেগুলো selected করা আছে, অর্থাৎ যেগুলোর অ্যাট্রিবিউট আছে
selected।
সিলেক্টর :selected কাজ করে
option ট্যাগযুক্ত এলিমেন্টগুলোর জন্য। এটি
চেকবক্স
(checkbox) বা
রেডিও বাটনের
(radio) সাথে কাজ করে না,
সেগুলোর জন্য ব্যবহার করুন সিলেক্টর
checked।
যেহেতু :selected CSS স্পেসিফিকেশনের অংশ নয়,
তাই আধুনিক
ব্রাউজারে পারফরম্যান্স উন্নত করার জন্য
প্রথমে খাঁটি CSS-সিলেক্টর ব্যবহার করে এলিমেন্টগুলো ফিল্টার করা ভালো,
তারপর
.filter(':selected') প্রয়োগ করুন।
সিনট্যাক্স
এভাবে আমরা
selected অ্যাট্রিবিউটযুক্ত এলিমেন্টগুলো নির্বাচন করি:
$(':selected');
উদাহরণ
আসুন, ড্রপ-ডাউন লিস্টে আইটেম নির্বাচন করার সময়,
সেটিকে লিস্টের নিচে সবুজ রঙে দেখাই।
আপনি দেখতে পাচ্ছেন, আপনার প্রথম ক্লিক করার আগেই
ডিফল্টভাবে নির্বাচিত আইটেমগুলো দেখানো হবে,
সেগুলো হলো 'bbb' এবং 'ddd':
<select name="texts" multiple="multiple">
<option>aaa</option>
<option selected="selected">bbb</option>
<option>ccc</option>
<option selected="selected">ddd</option>
<option>eee</option>
<option>fff</option>
</select>
<div></div>
div {
color: green;
}
$('select')
.change(function() {
let str = '';
$('select option:selected').each(function() {
str += $(this).text() + ' ';
});
$('div').text(str);
}).trigger('change');
