jquery .clone () не работает

Question

Я пытаюсь клонировать div внутри формы.Моя идея состоит в том, чтобы позволить пользователям вставлять несколько записей в мое приложение.

В div .anotacao содержатся все поля, которые необходимо ввести пользователю.Таким образом, клонируя его, я могу разрешить пользователям вставлять n записей одновременно.

<div class="anotacao">
          <div class="field">
            <input id="date" name="date" value="<?=date('d/m/Y');?>" class="date" />
          </div>

          <div class="field">
            <span class="label">às</span>
            <input id="hour" name="hour" value="<?=date('h');?>" class="smallest" />
            <span class="label">:</span>
            <input id="minutes" name="minutes" value="<?=date('i');?>" class="smallest" />
          </div>

          <div class="field">
            <?=form_dropdown('event',$this->entry->list_events(),'','id="event" class="event select"');?>
          </div>

          <div class="field valor">
            <input id="valor" name="valor" value="anotação" class="entry" />
            <span class="show-type"></span>
          </div>

          <div class="field obs">
            <input id="obs" name="obs" value="obs" class="obs" />
          </div>
        </div>

Чтобы клонировать это, у меня есть ссылка с классом .add-line.Когда пользователь нажимает на эту ссылку, я пытаюсь клонировать div, вызывая этот JS:

$('.add-line').live('click', function(event){
$('.anotacao').clone().removeClass('anotacao');
return false;

});

Кажется, все правильно, но я не получаю клон или что-то еще.Например, если я удаляю функцию клонирования и помещаю предупреждение, оно отображается.

Answer 1

Когда вы вызываете .clone (), его нужно добавить к чему-либо. Попробуйте это:

$('.add-line').live('click', function(event){
  $('.anotacao').clone().appendTo('#anotacao-container');
  return false;
});

<div id="anotacao-container">
  <div class="anotacao">
  ... fields here      
  </div>
</div>

Answer 2

Попробуйте добавить его

$(this).append($('.anotacao').clone().removeClass('anotacao'));

Answer 3

Вы должны сделать что-то со значением, возвращаемым .clone(). jQuery не вставляет клонированный элемент в разметку для вас.

$('.add-line').live('click', function(event){
    var $source = $('.anotacao');
    $source.clone().removeClass('anotacao').after($source);
    return false;
});

Вы должны выбрать только один div.anotacao для клонирования каждый раз; в противном случае вы получите экспоненциально растущее число клонов! Ой, забыл, что removeClass() позаботился об этом!

Answer 4

Вам нужно указать, куда вы хотите, чтобы это было appendTo.