select2 下拉選 clone後無法使用
源碼：
<head>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="select2.js"></script>
<script type="text/javascript">
//頁面加載完成後初始化select2控件
$(function () {
//初始化select2
$("#area").select2();
var i=0;
//點擊克隆select2下拉選
$("#add").click(function(){
//銷燬select2
$("select").select2("destroy");
//select2銷燬不徹底，導致克隆後無法使用，需要把select2其他屬性清理徹底這樣纔可以不影響克隆後的select2
$("select").removeAttr("data-select2-id tabindex aria-hidden");
$("option").removeAttr("data-select2-id");
var ids="AA"+i++;
//克隆後需要附上新的id值，賦值select2初始化會有問題
var newSel=$("#area").clone().attr("id",ids);
$("body").append(newSel);
$("select").select2();
});
});
</script>
</head>
<body>
<span>區域：</span>
<select id="area" style="width:70px">
<option value="0"></option>
<option value="1">珠海</option>
<option value="2">深圳</option>
<option value="3">澳門</option>
<option value="4">香港</option>
</select>
<input type="button" value="新增" id="add">
</body>
