gpt4 book ai didi

javascript - 在克隆字段上添加删除按钮

转载 作者:行者123 更新时间:2023-11-28 18:37:49 27 4
gpt4 key购买 nike

大家好,我需要帮助在克隆发生后添加“删除”按钮。 “删除”按钮应删除克隆的字段。任何建议将不胜感激。 Bootply 版本 - http://www.bootply.com/LiqkgWUFF6

提前致谢。

var template = $('#line_1').clone();

$('#cloneButton').click(function () {
var rowId = $('.row').length + 1;
var klon = template.clone();
klon.attr('id', 'line_' + rowId)
.insertAfter($('.row').last())
.find('option')
.each(function () {
$(this).attr('id', $(this).attr('id').replace(/_(\d*)$/, "_"+rowId));
})
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="row" id="line_1">

<div class="form-group col-md-2">
<label class="control-label">State</label>
<select class="form-control">
<option id="Select_1">Select State</option>
<option id="Selangor_1">Selangor</option>
<option id="KualaLumpur_1">Kuala Lumpur</option>
<option id="Malacca_1">Malacca</option>
<option id="Perak_1">Perak</option>
<option id="Kedah_1">Kedah</option>
</select>
</div>
</div>

<a id="cloneButton" class="btn btn-primary">Add State</a>

最佳答案

试试这个:

var template = $('#line_1').clone();

$('#cloneButton').click(function () {
var rowId = $('.row').length + 1;
var klon = template.clone();
console.log(klon)
klon.attr('id', 'line_' + rowId)
.insertAfter($('.row').last())
.find('option')
.each(function () {
$(this).attr('id', $(this).attr('id').replace(/_(\d*)$/, "_"+rowId));
})

$("#line_" + rowId).append("<a href='javascript:void(0);' class='remove'>delete</a>")
});

$(document).on("click", ".remove", function() {
$(this).closest(".row").remove();
});

关于javascript - 在克隆字段上添加删除按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36736121/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com