Cách dùng :selected Selector trong jQuery
Selected Selector sẽ lựa chọn tất cả các phần tử đã được lựa chọn(selected).

Selected Selector sẽ chỉ hoạt động đối với các thẻ option của thẻ select. Nó không hoạt động với thẻ checkbox hay thẻ input radio, sử dung :checked
cho các thẻ này.
Chú ý: Bởi vì :selected
là một Jquery extension và không phải là một phần thiết lập của CSS, các truy vấn sử dụng :selected
sẽ không thể phát huy hiệu quả của phương thức querySelectorAll()
. Để đạt được hiệu quả cao nhất, đầu tiên bạn nên sử dụng một selector được hỗ trợ bởi CSS sau đó sử dụng .filter(":selected")
để lọc lại kết quả.
Cú pháp
jQuery( ":selected" )
Ví dụ
Tìm kiếm các phần tử option đã được seleceted
và hiển thị giá trị của chúng:
Bài viết này được đăng tại [free tuts .net]
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Học lập trình miễn phí tại freetuts.net</title> <script src="https://freetuts.net/cnd/js/jquery/jquery-3.2.1.min.js"></script> </head> <body> <h1>Học lập trình miễn phí tại freetuts.net</h1> <select name="garden" multiple="multiple"> <option>PHP</option> <option selected="selected">CSS</option> <option>HTML</option> <option selected="selected">PYTHON</option> <option>JAVASCRIPT</option> <option>C#<option> </select> <hr> <div id="result"></div> <hr> <button onclick="myFunction()">Click vào đây để xem kết quả</button> <script> function myFunction(){ var str = ''; $("option:selected").each(function() { str += $( this ).text() + " "; }); $("#result").html('Các ngôn ngữ đã biết:' + str); } </script> </body> </html>
Trong ví dụ này, mình có sửu dụng .each()
để lặp qua tất cả các kết quả trả về từ selector :selected
.
Kết quả:
Tham khảo: jquery.com