2011-09-20 50 views
9

Có thể tạo các trường tùy chọn lồng nhau trong một biểu mẫu thả xuống, giống như bạn sẽ tạo danh sách ul lồng nhau?HTML/CSS: Lồng nhau <options> trong trường <select>?

Vì thay đổi chỉ mang tính thẩm mỹ, có thể thực hiện điều này bằng css không?

+0

Xem http://stackoverflow.com/questions/1037732/nesting-optgroups-in-a-dropdownlist-select – home

Trả lời

15

Bạn có thể sử dụng <optgroup> để tạo ra một mức duy nhất của tổ ...

<select> 
    <optgroup label="Options 1"> 
    <option>Option 1.1</option> 
    <option>Option 1.2</option> 
    </optgroup> 
    <optgroup label="Options 2"> 
    <option>Option 2.1</option> 
    <option>Option 2.2</option> 
    </optgroup> 
</select> 

Ví dụ: http://jsfiddle.net/JaZAm/1/

Lưu ý rằng các nhãn nhóm không phải là lựa chọn có thể lựa chọn. Trong trường hợp đó, tôi sẽ khuyên bạn nên sử dụng giải pháp thụt lề văn bản được đề cập trong câu trả lời hàng đầu cho câu hỏi mà nhà được liên kết trong nhận xét của mình.

1

Bạn không thể lồng nhiều <option> s. Nếu bạn muốn nhóm các thành phần <option>, hãy sử dụng <optgroup>.

0

Không, không thực sự. Có một thẻ optgroup là các tiêu đề không thể chọn mà bạn có thể thêm vào giữa các phần, nhưng không thể làm tổ cho các phần tử <select>.

0

Xem xét sử dụng thẻ optgroup. Đối với hỗ trợ kiểu dáng, có một số, nhưng bạn đang ở lòng thương xót của trình duyệt như thế nào đến nay bạn có thể mang nó vì nó là một yếu tố hình thức.

http://www.456bereastreet.com/lab/styling-form-controls-revisited/select-single-optgroup/

Nếu bạn cần restyling rộng, xem xét xây dựng phụ tùng UI của riêng bạn sử dụng có lẽ là một UL cấu trúc lồng nhau và đem lại cho nó sự tương tác qua JavaScript.

Các vấn đề liên quan