Czy istnieje sposób na uzyskanie wielu linii w elemencie ?Czy możesz mieć wiele linii w elemencie <option>?
Jak to:
-------------------------
| Normal <option> element |
-------------------------
| <option> element broken |
| onto two lines |
-------------------------
| Normal <option> element |
-------------------------
Czy istnieje podejście HTML/CSS, czy mam użyć JavaScript?
To szczególny przypadek wyświetlania znaczników HTML wewnątrz elementu <option></option>. O ile mi wiadomo, przeglądarki zachowują się bardzo różnie w tym obszarze (Firefox wyświetla nawet obrazy, inne przeglądarki ignorują większość lub wszystkie tagi) i nie ma rozwiązania opartego na różnych przeglądarkach. Najprawdopodobniej będziesz musiał emulować ją za pomocą JavaScript i innych znaczników.
Na http://www.w3.org/TR/2011/WD-html-markup-20110113/option.html mówią:
Dozwolone treści: normalny charakter Dane
... który jest zdefiniowany w http://www.w3.org/TR/2011/WD-html-markup-20110113/syntax.html#normal-character-data
Spec jest trudno zrozumieć, jak zwykle, ale rozumiem, że nie można wstawić literału < (tj. znacznika HTML, takiego jak <br>). Nie mogę znaleźć miejsca, w którym definiuje to zachowanie za pomocą pustego miejsca, ale większość przeglądarek wydaje się je zwinąć.
Problem z selekcja jest taki, że są one elementami systemu OS, w przeciwieństwie do elementów formularza sieci. Dlatego nie można ich w niektórych przeglądarkach (kaszel ... IE6) w przeciwieństwie do innych wejść. Czy widziałeś gdzieś tego przykład? Ponieważ system operacyjny tego nie uwzględnia, przeglądarka również tego nie robi.
Chciałbym również zaznaczyć, że nie jest to bardzo przyjazne dla użytkownika. Użytkownicy są przyzwyczajeni do idei pola wyboru zawierającego opcje na pojedynczych liniach. Jeśli zaczniesz umieszczać je w wielu liniach, będziesz przeciwstawiał się użyteczności i nieodłącznym dostępom do pola wyboru. To może nie być taki dobry pomysł, aby wybrać tę trasę.
Po prostu moja opinia, ale mam nadzieję, że to ma sens.
Jako że ta odpowiedź ma już prawie 3,5 lat, dodam teraz, że istnieje wiele bibliotek JS, które zmieniają okno wyboru. Niektóre z nich, ze względu na swój charakter, wymuszą wybór opcji na dwie linie. Jeśli nadal jest to problemem dla ludzi, może to być opcja. Należy pamiętać, że wiele bibliotek do stylizacji nie jest obsługiwanych w systemie iOS ani Android. – tadywankenobi
Obawiam się, że nie. Przeglądarki wydają się ignorować znaki nowej linii i znaczniki HTML <br> wewnątrz elementów <option> i nie sądzę, że JavaScript umożliwia manipulowanie sposobem wyświetlania tego tekstu.
Nie, musisz zbudować niestandardową rozwijaną listę takich rzeczy.
jQuery oferuje wiele z nich; prawdopodobnie możesz użyć CSS do zdefiniowania height dla konkretnych opcji, aby osiągnąć to, czego potrzebujesz.
To nie może być to, co chcesz, ale może dostać dwie linie za opcję, za pomocą „optgroup” tag np:
<select>
<optgroup label="Click below for 'yes'">
<option value="yes">Yes</option>
</optgroup>
<optgroup label="Click below for 'No'">
<option value="no">No</option>
</optgroup>
</select>
To nie pozwoli na rozdzielenie JEDNEJ opcji na DWÓCH liniach –
HotKey, mówiąc wprost, masz rację. To, co zasugerowałem, daje efekt podziału opcji na dwie linie (zobacz http://jsfiddle.net/elusien/Sqc6Z/). Niezależnie od wybranej opcji, zwracany jest tylko drugi wiersz. W mojej obronie powiedziałem, że może nie być to, co jest pożądane. – Neil
W rzeczywistości pomysł podzielenia opcji i odroczenia grupy nie wydaje się złym pomysłem. Ale mówiąc, jak by to działało ze źródłem danych? –
co ma na myśli przez wiele linii w elemencie opcji? – Vivek
Zazwyczaj masz jeden wiersz w wybranym elemencie opcji, chcę mieć dwie linie w tym elemencie, np. każda opcja ma 2 wiersze –
Użyj Javascript. –