jQuery: Cách Thiết Lập Giá Trị Cho Select Option Hiệu Quả
Trong thế giới phát triển web hiện đại, jQuery vẫn là một thư viện JavaScript quan trọng giúp đơn giản hóa việc thao tác với các thành phần HTML. Một trong những tác vụ phổ biến nhất là thiết lập giá trị cho select option. Dưới đây là các phương pháp hiệu quả nhất để thực hiện việc này vào ngày 28/12/2025.
Phương pháp 1: Sử dụng hàm val()
Hàm val() là phương thức đơn giản và trực tiếp nhất để thiết lập giá trị cho một phần tử select. Cú pháp như sau:
$('select').val('giá-trị-cần-thiết-lập');Ví dụ thực tế:
// Thiết lập giá trị cho select có id là "mySelect" $('#mySelect').val('option2'); // Thiết lập giá trị cho tất cả các select trong form $('form select').val('default-value');Phương pháp 2: Sử dụng hàm attr() với thuộc tính selected
Đôi khi bạn có thể cần thiết lập thuộc tính selected trực tiếp cho option:
$('select option[value="giá-trị"]').attr('selected', true);Phương pháp 3: Thiết lập lựa chọn mặc định cho select box
Khi cần thiết lập lựa chọn mặc định cho một select box khi trang được tải:
$(document).ready(function() { $('#mySelect').val('giá-trị-mặc-định'); });Lưu ý quan trọng
- Đảm bảo mã jQuery được thực thi sau khi phần tử select đã được tải trong DOM
- Kiểm tra kỹ giá trị bạn đang thiết lập có tồn tại trong các option không
- Sử dụng $(document).ready() hoặc $(window).on('load') để đảm bảo các phần tử đã sẵn sàng
Ứng dụng thực tế
Các kỹ thuật này đặc biệt hữu ích khi làm việc với biểu mẫu động, xử lý dữ liệu từ API, hoặc khi cần đồng bộ hóa nhiều thành phần select trên trang web.
jQuery #JavaScript #WebDevelopment #Programming #HTML #DOMManipulation #FrontendDevelopment #SelectBox #FormHandling
Không đọc được JSON hợp lệ.
Xem đầy đủ Kết quả tìm kiếm hình ảnhjquery set value of select option