sposób na sprawdzenie, czy opcje nie mieszczą się wewnątrz zaznaczenia - w IE

Question

W IE6 i ewentualnie 7, jeśli ustawisz szerokość jakiejkolwiek wartości innej niż automatyczna, jeśli opcje wewnątrz tego zaznaczenia są szersze niż szerokość selekcji, zostają odcięte. to jest złe. Firefox jest wystarczająco inteligentny, aby tego nie robić.

Pytanie: Jak mogę sprawdzić, czy opcje są obcięte za pomocą javascript?

W jaki sposób rozwiązałeś ten problem poza ustawieniem szerokości na auto?

Answer 1

Dobre pytanie. Trochę rant tutaj, ale implementacja IE z <select> kontroli jest fatalna. Posiada następujące problemy (m.in. jestem pewien):

• (Jak zauważyłeś) ustawienie szerokości na <select> odcina <option> elementów, niezależnie od overflow instrukcji
• mają tę magic ability to sit overtop of all other controls on the page, niezależnie od pozycji i nawarstwiania (z-index) instrukcji. To była ogromna PITA dla wczesnych twórców widżetów "dialogowych"; wszelkie listy rozwijane znajdujące się za oknem dialogowym będą przekradać się nad samym oknem dialogowym.
• you cannot disable individual <option> elements
• you cannot hide/show individual <option> elements
• z <select> nie odzwierciedla style CSS ustawione na wybranym <option>
• can't set the innerHTML property to a string of new option items
• jeśli nie nie ustawić atrybut value na każdym <option>, mySelectBox.value cicho nie
• podczas korzystania ze strzałek na klawiaturze do poruszania się po liście <option> elementów, zdarzenie pożary change na każdym naciśnięciem klawisza (Opera ma ten problem zbyt)
• css style na <option> s oraz <optgroup> s są zazwyczaj całkowicie ignorowane (only backgound-color and color work)
• programowo zmienia listę opcji ukrywa listę rozwijaną (to jest do bani dla próby implementacji typu "naprzód", dla których rozwijane menu ma pozostać widoczne)
• IE7 próbuje dopasować wszystkie opcje na ekranie, gdy są wyświetlane. Dla dużych list Oznacza to zawartość rozwijana będzie siedzieć overtop z dropdow gdy pokazane (to samo w sobie nie jest złe, ale jest to niezgodne z innymi wersjami IE)

Co do twojego problemu, jednym z rozwiązań jest Przełącznikiem width do "auto" przy opcji są przedstawione i ustawiony, jeśli powrót do zadanej szerokości, gdy opcje są zamknięte, tak jak przedstawiono na: http://css-tricks.com/select-cuts-off-options-in-ie-fix/

oczywistą wadą jest to, że śruby do góry przepływ dokumencie sąsiednie elementy wszystkie zmieniają się, aby uwzględnić ustawienie width:auto.

Answer 2

Spójrz na this post autorstwa Chrisa Coyiera.