Question

我正在尝试使用数组名称添加动态字段，我已经像

那样完成了

<div class="extra_subject"></div>
<button class="add_sub btn">Add</button>
<button class="rem_sub btn">Remove</button>

在JS中我做了

var subject_div = $('<div class="sub_add_extra">'
    +'<div class="control-group">'
        +'<label for="sub_form" class="control-label">Subject</label>'
        +'<div class="controls">'
            +'<select name="add_subject[]">'
                +'<option value="">Please Select</option>'
                 <?php foreach($sub as $row){ ?>
                    +'<option value="<?php echo $row->id; ?>" ><?php echo $row->subject_name; ?></option>'
                <?php } ?>
            +'</select>'
        +'</div>'
     +'</div>'
+'</div>');
$('.add_sub').click(function(e){
    e.preventDefault();
    $('.extra_subject').append(subject_div);
});
$('.rem_sub').click(function(e){
    e.preventDefault();
    $('.sub_add_extra').last().remove();
});

第一次附加内容，然后当我尝试将其覆盖现有的div .sub_add_extra并在我点击删除按钮时正确删除。

Answer 1

使用clone()

$('.add_sub').click(function(e){
    e.preventDefault();
    $('.extra_subject').append(subject_div.clone());
});

DEMO HERE 现在，您一次又一次地追加相同的对象。 clone()将创建该对象的克隆并每次附加此克隆对象。如果您将某个事件附加到原始对象，请使用clone(true)

Answer 2

尝试创建这样的函数并在点击时使用它肯定会起作用

function addmoreoption() {
    var html_option = '<tr valign="center"><td valign="center" bgcolor="#E8E8E8" >Name</td></tr>';
    $('#more_option').append(html_option);
}

Div在jquery中不会多次追加？

2 个答案: