不能.append()选项来选择元素

时间:2015-10-26 15:51:40

标签: jquery append appendto

我的.append()函数有问题。

$('#add_row').on('click', function(){
    var new_row = $(row_default).clone();
    new_row.find('.col-1').text($(this).find('.ass-col-partenza').text());
    new_row.find('.col-2').text($(this).find('.ass-col-colore').text());
    new_row.find('.col-3').empty().html($select.clone());
    $table.append(new_row);
    console.log('New row added with select: ', $select);
});

$('#add_option').on('click', function(){
    var option = $('<option/>').val('Value '+idx).text('Text '+idx);
    idx++;
    // This should add options, and they should be added to DOM in future .append()
    $select.append(option);
    $('#my_table').find('.my_select').append(option);
    console.log('Added new option, new select is: ',$select);
});

这是一个简短的指令清单: http://jsfiddle.net/v15zyzxj/5/

我希望如果我附加一个选项,如果我追加一个新行就会显示。

PS我删除了我之前的问题,因为它变得非常混乱。

1 个答案:

答案 0 :(得分:3)

正在删除刚刚创建并添加到option的新$select元素,并将其添加到DOM上的.my-select元素中。为避免这种情况,请按照以下建议将克隆添加到$select

只需改变:

$select.append(option);

要:

$select.append(option.clone());

DEMO

或者,您可以使用.add()将要添加新option的所有元素(在DOM或内存中)合并到.append(),而不需要.clone() }}:

//$select.append(option);
$('#my_table').find('.my_select').add($select).append(option);

DEMO