Добавление радио кнопок в неупорядоченный список с помощью Jquery не работает должным образом

0

В чем разница между этими двумя утверждениями при попытке добавить переключатель к тегу li с помощью JQuery?

var inputText = $("<input />", {"type":"radio", "name":"choices", "value":choices[i],     "text":choices[i]});'

var inputText =$("<li />").html( '<input type="radio" name="choices" value="'+choices[i]+'">' + choices[i] + '</input>');

Первый не отображает текст рядом с переключателем на странице HTML, хотя при проверке элемента код HTML верен, а последний отображается правильно. Я предпочитаю прежний синтаксис, потому что его чище, но я не могу заставить его работать.

Теги:

2 ответа

1

Недопустимо, чтобы элемент input содержал текст. Если вы посмотрите на спецификацию, вы увидите:

Начальный тег: обязательно, Конечный тег: запрещено

В первом примере jquery помещает текст внутри входного тега, который браузер не отображает, поскольку он недействителен. Что-то вроде этого:

<input>text here</input>

Во втором примере, хотя вы пытались сделать его недействительным, он преобразуется в это:

<input>
text here

Если вы проверите его, вы увидите, что текст находится вне ввода и, следовательно, отображается.

Действительно, оба подхода ошибочны, хотя второй технически работает, конечный тег должен быть остановлен:

var inputText =$("<li />").html('<input type="radio" name="choices" value="'+choices[i]+'">' + choices[i]);
0

С Джеймсом. Кроме того: если вы хотите сохранить синтаксис в первом примере, я думаю, вы могли бы использовать:

$('<label />').append($("<input />", {"type":"radio", "name":"choices", "value":"foo" }).after('foo'))

Который также обертывает ваш ввод в ярком элементе label который позволяет также нажимать на текстовую метку.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню