ซีเลคเตอร์ selected

ซีเลคเตอร์ :selected เลือกองค์ประกอบ ที่ถูกเลือก นั่นคือองค์ประกอบที่มีแอตทริบิวต์ selected ซีเลคเตอร์ :selected ใช้งานได้กับองค์ประกอบที่มีแท็ก option มัน ไม่ทำงานกับช่องทำเครื่องหมาย (checkbox) หรือ ปุ่มตัวเลือกเรดิโอ (radio) สำหรับพวกนั้นให้ใช้ซีเลคเตอร์ checked เนื่องจาก :selected ไม่ได้อยู่ในข้อกำหนด CSS ดังนั้นเพื่อเพิ่มประสิทธิภาพใน เบราว์เซอร์สมัยใหม่ ควรกรององค์ประกอบก่อน โดยใช้ CSS selector ล้วนๆ จากนั้น ค่อยใช้ .filter(':selected')

ไวยากรณ์

นี่คือวิธีเลือกองค์ประกอบที่มี แอตทริบิวต์ selected:

$(':selected');

ตัวอย่าง

มาแสดงรายการที่เลือกใน dropdown ใต้รายการด้วยสีเขียวทุกครั้งที่เลือก อย่างที่คุณเห็น ก่อนคลิกครั้งแรก จะแสดงรายการที่เลือกตามค่าเริ่มต้น นั่นคือ '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');

ดูเพิ่มเติม

เมธอด filter,
ซึ่งกรององค์ประกอบในเซ็ตตามซีเลคเตอร์ที่กำหนด
แอตทริบิวต์ selected
ซีเลคเตอร์ checked,
ซึ่งเลือกองค์ประกอบที่ถูกเลือก นั่นคือองค์ประกอบ ที่มีแอตทริบิวต์ checked
หรือ selected
แท็ก option
และ select