Các tùy chọn thả xuống trong HTML là một số mục thân thiện với người dùng thân thiện nhất. Tạo kiểu cho chúng là một nỗi đau và chức năng cơ sở của chúng không phải là rất hữu ích trừ khi bạn có một số lượng hạn chế các mặt hàng với một số lượng hạn chế nhu cầu.
Đó là nơi Chosen đến. Nó là một thư viện javascript làm cho trải nghiệm dropdown đẹp hơn nhiều, cũng như đẹp hơn nhiều so với phối cảnh chức năng.
Chọn… RedPurpleMàu xanhVàngMàu xanhĐỏTrắng
Ở trên, bạn có thể thấy chức năng được chọn mặc định. Nó trông tuyệt vời, và theo mặc định có một cơ chế tìm kiếm đơn giản để lọc qua các kết quả trong trường hợp bạn có một số lượng lớn các mục trong trình đơn thả xuống của mình. Đầu tiên, bao gồm các tệp javascript và css. Sau đó, khởi tạo chúng với mã bên dưới.
$ (tài liệu) .ready (function () {$ (". selected"). selected ();}); Nó là dễ dàng như vậy. Bây giờ chúng ta hãy đưa nó đến cấp độ tiếp theo, nếu bạn muốn có thể thay đổi chức năng của menu thả xuống để cho phép nhiều lựa chọn? Tìm kiếm "Red" bên dưới, sau đó nhấn enter, tìm kiếm "Blue", sau đó nhấn enter. Bây giờ bạn có thể loại bỏ chúng dễ dàng từ lựa chọn của bạn bằng cách chỉ cần nhấn X hoặc backspace hai lần.
Chọn… RedPurpleMàu xanhVàngMàu xanhĐỏTrắng
Tất cả bạn phải làm là vượt qua nhiều tùy chọn trong cuộc gọi của lựa chọn như dưới đây. Không có thay đổi đối với javascript, nó được khởi tạo theo cùng một cách chính xác.
Hãy xem demo bên dưới hoặc bạn có thể tải xuống các ví dụ dưới dạng zip.
