Это плохо, чтобы положить теги внутритеги, только для манипуляции со строками, а не для укладки? - PullRequest
51 голосов
/ 15 апреля 2011

Я хотел бы сделать группы текстового содержимого тега <option />. Скажем, у меня есть следующее: <option>8:00 (1 hour)</option>, шаблон времени 8:00 может быть изменен, тогда текст в скобках (1 hour) также может быть изменен.

Я думал о том, чтобы сделать что-то вроде

<option>
  <span>8:00</span>
  <span> (1 hour)</span>
</option>

Плохо помещать теги <span /> внутри тегов <option />, только для манипуляции со строками, а не для стилизации?

Ответы [ 6 ]

79 голосов
/ 15 апреля 2011

Из спецификации HTML 4.01:

<!ELEMENT OPTION - O (#PCDATA)         -- selectable choice -->

Из спецификации проекта HTML 5:

Модель содержимого: Текст.

(Даже спецификации HTML 3.2 и HTML 2 говорят: <!ELEMENT OPTION - O (#PCDATA)*>)

Элемент option не может иметь дочерних элементов. Так что да, это плохо.

4 голосов
/ 25 октября 2013

Вы можете использовать плагин Javascript, чтобы преодолеть это ограничение.Например, плагин jQuery "Select2" Домашняя страница плагина Select2 .Я использую его в нескольких своих проектах и ​​думаю, что он довольно гибкий и удобный.

Их несколько, но они делают одно и то же - преобразуют традиционные <select> в <div> блоки сдополнительная функциональность.

2 голосов
/ 15 апреля 2011

Вам лучше использовать замену HTML для вашего <select>, если вы хотите сделать это.

2 голосов
/ 15 апреля 2011

Элемент option

Модель содержимого: Текст

Нет, все не в порядке.Подумайте о том, чтобы сохранить значения в вашем скрипте, чтобы при необходимости их можно было перекомпоновывать.

1 голос
/ 16 мая 2013

Как установлено другими людьми, и я пробовал с <b> и другими тегами, <option> не принимает теги внутри него.

Что вы можете сделать, поскольку вы не можете использовать <span> внутри тега <option>,
Вы можете использовать индексный номер для извлечения текста через
document.getElementById (selectid) .options [x] .text, где x - соответствующий индекс, в качестве переменной.

Затем вы используете "(", чтобы разделить переменную на время, а также удалить последний символ, который удаляет ")"

Пример:

    <script type="text/javascript">
    function extractSelectText()
    {
    var text = document.getElementById("main").options[1].text
    /* 
    var tlength = text.length
    var splitno = tlength - 1
    var text2 = text.slice(0, splitno)
    var textArray = text2.split(" )")
    var time = textArray[0]
    var hours = textArray[1]
    }
    </script>

Изменить его гораздо проще:

    <script type="text/javascript">
    function changeSelectText()
    {
    /* add your code here to determine the value for the time (use variable time) */

    /* add your code here to determine the value for the hour (use variable hours) */
   var textvalue = time + " (" + hours + ")"
   document.getElementById("main").options[1].text
   }
   </script>

Если вы используете функцию for, вы можете изменить каждое значение выбора, заменив 1 на 2, 3 и т. Д., И установить функцию заданного интервала для ее постоянного обновления.

0 голосов
/ 15 апреля 2011

Одним из вариантов редактирования будет использование какого-то необычного соответствия шаблону для обновления содержимого. Это будет медленнее и более ресурсоемким, и зависит от того, насколько регулярен формат, но не требует каких-либо изменений HTML. Однако мое беспокойство касалось доступности и удобства пользователей. Изменение значений в программном обеспечении для чтения с экрана затруднительно, а также может запутать других пользователей.

...