проблема с пробелами между словами в атрибуте value

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

Пожалуйста, взгляните на эту скрипку.

У меня возникли проблемы с добавлением поля ввода к элементу div.

Есть ли способ поместить всю фразу (например, «Вариант 1») в двойные кавычки атрибута value?

Firebug показывает, что слово после пробела («1» в этом примере) выходит за пределы кавычек, подобных этому:

 <input type="radio" value="Option" 3>
  

Но я хочу, чтобы это было:

 <input type="radio" value="Option 3">
  

HTML:

 <div id="post_text"></div>
<select multiple>
    <option value="A">Option 1</option>
    <option value="B">Option 2</option>
    <option value="C">Option 3</option>
    <option value="D">Option 4</option>
    <option value="E">Option 5</option>
    <option value="F">Option 6</option>
</select>
  

Javascript:

 var post_text = $('#post_text');

$("select").multiselect({
    selectedText: "# of # selected",
    click: function (event, ui) {
        if (ui.checked) {
            var span = '<input type="radio" value='  ui.text  '><div id="'   ui.value   '">'  ui.text  '</div>'
            post_text.append(span);
        } else {
            post_text.find('#' ui.value).remove();
        }
    }
});
  

Комментарии:

1. Используйте кавычки, как и остальные ваши атрибуты. value="' ui.text '" Это идентично тому, как вы написали свой id атрибут

Ответ №1:

У вас отсутствуют кавычки вокруг атрибута:

 var span = '<input type="radio" value="'  ui.text  '"> ...
  

Ответ №2:

У Джеймса правильный ответ, но вот альтернатива. Я всегда стараюсь работать со значениями и атрибутами напрямую с помощью javascript, а не создавать большую строку, именно по этой причине:

Поэтому вместо:

 var span = '<input type="radio" value='  ui.text  '><div id="'   ui.value   '">'  ui.text  '</div>'
post_text.append(span);
  

может быть , рассмотреть:

 var $input = jQuery("<input>").attr("type", "radio").val(ui.text);
var $div = jQuery("<div></div>").attr("id", ui.value).html(ui.text);
post_text.append($input).append($div);
  

Таким образом, вам не придется думать о смешивании одинарных и двойных кавычек, или экранировании кавычек в содержимом, или о чем-либо подобном — функции javascript ( attr , val и html функции jQuery) сделают все это за вас.