jQuery中clone()函数怎么实现表单中增加和减少输入项

这篇文章主要介绍jQuery中clone()函数怎么实现表单中增加和减少输入项，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

创新互联是一家集网站建设,浮山企业网站建设,浮山品牌网站建设,网站定制,浮山网站建设报价,网络营销,网络优化,浮山网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

之前一直没有深入了解到clone()函数的方法，所以对应表单中增加和减少输入项一直使用如：

var copy_html=$(选择器).html(); 
alert(copy_html);

问题在于得出的copy_html直接是HTML内容代码，未经过object封装，而使用：

var copy_html=$(选择器).clone(); 
alert(copy_html);

得出未object对象类型，若$(选择器)包含了某个触发，如 onclick，如果想copy_html继续沿用onclick方法，只需添加true：clone(true)使用。

直接上图：

点击“+”,拷贝自身，并在自身之前追加：

增加方法：

$(function(){　　
//增加省份、招生人数
　　$(".addbtn").click(function(){
　　　　var copy_str=$(this).parents(".form-group").clone();
　　　　copy_str.find("i").removeClass("fa-plus").addClass("fa-minus");　　　　//将按钮图标“+”，变为“-”　　　　
　　　　copy_str.find("button").removeClass("addbtn");　　　　　　　　　　　　　//去除class名“addbtn”,避免新增的输入项沿用此添加方法
　　　　copy_str.find("button").attr("onclick","canelf(this)");　　　　　　　　　　//增加点击删除自身触发事件
　　　　$(this).parent().parent().parent().before(copy_str);　　　　　　　　　　//追加
　　});
});
//增加项，删除方法
function canelf(e){
　　$(e).parent().parent().parent().remove();
}

最后贴上HTML代码：

省份



全部
北京市
浙江省
天津市
安徽省
上海市
福建省
重庆市
江西省
山东省
河南省
湖北省
湖南省
广东省
海南省
山西省
青海省
江苏省
辽宁省
吉林省
台湾省
河北省
贵州省
四川省
云南省
陕西省
甘肃省
黑龙江省
香港特别行政区
澳门特别行政区
广西壮族自治区
宁夏回族自治区
新疆维吾尔自治区
内蒙古自治区
西藏自治区