关于js select onchange事件无法触发的问题

Question

页面加载后 select onchange事件可以触发，但是我移除部分标签，重新追加新标签，select onchange事件无法触发，哪里出错了吗？

$(document).ready(function () {
//选择区域
$(".area").on('change', function () {
var node=$(this).parent().parent().find(".floor");
node.empty();
$(node).append('<option value="0">请选择楼盘</option>');
var area = $("option:selected", this).val();
var ids = "";
$("#compare-floor-dl dd").each(function () {
ids += ","+$(this).attr("id");
});
ids=ids.substring(1);
$.post("@Url.Action("ChooseArea")", { area: area,ids:ids }, function (data) {
for (var i = 0; i < data.length; i++) {
$(node).append('<option value="' + data[i].id + '">' + data[i].proname + '</option>')
}
});
});

    //选择楼盘
    $(".floor").on('change', function () {
        $(this).parent().parent().parent().parent().remove();
        var id = $("option:selected", this).val();
        $.post("@Url.Action("ChooseFloor")", { id: id }, function (data) {
            $("#compare-floor-dl").append('<dd id="'+data.id+'"><ul>' +
                '<li class="first" style="height: 155px;">' +
                '    <a href="/NewHouses/Detail/' + data.id + '" target=_blank title="' + data.proname + '"><img src="'+data.img+'" width=120 height=120></a>' +
                '</li>' +
                '<li><a href="/NewHouses/Detail/'+data.id+'" target=_blank title="' + data.proname + '" class="red">' + data.proname + '</a>'+
                '<span class="jclose" onclick="jclose('+data.id+')">[重新选择楼盘]</span></li>' +
                '<li>' + data.area + '</li>' +
                '<li>'+data.site+'<a href="/NewHouses/Detail/' + data.id + '#dt" target="_blank" class="red">[查看地图]</a></li>' +
                '<li>'+data.typemenu+'</li>' +
                '<li>'+data.sales_status+'</li>' +
                '<li>'+data.pricedesc+'</li>' +
                '<li>'+data.property_costs+'</li>' +
                '<li>'+data.property_type+'</li>' +
                '<li>'+data.decoration+'</li>' +
                '<li>'+data.green_rate+'</li>' +
                '<li>'+data.kp_time+'</li>' +
                '<li>'+data.fin_time+'</li>' +
                '<li>'+data.development+'</li>' +
                '<li>'+data.sales_address+'</li>' +
                '<li><font>'+data.sales_tel+'</font></li>' +
                '<li class="hxt">' + data.traffic_flow + '</li>' +
                '<li class="hxt">' +
                    '<span style="padding:5px">' + data.around + '[<a href="/NewHouses/Detail/' + data.id + '" target=_blank>更多</a>]</span>' +
                '</li>' +
            '</ul></dd>');
        });
    });
});

//移除并重新追加
function jclose(id) {
$("#" + id + "").remove();
$("#compare-floor-dl").append('<dd id="0"><ul>' +
'<li class="first" style="height: 155px;">' +
'<p><b>添加楼盘</b></p>' +
'<p>' +
'<select class="area">' +
'<option value="">选择区域</option>' +
'<option value="小店区">小店区</option>' +
'<option value="迎泽区">迎泽区</option>' +
'<option value="万柏林区">万柏林区</option>' +
'<option value="尖草坪区">尖草坪区</option>' +
'<option value="晋源区">晋源区</option>' +
'<option value="杏花岭区">杏花岭区</option>' +
'</select>' +
'</p>' +
'<p>' +
'<select class="floor">' +
'<option value="0">请选择楼盘</option>' +
'</select>' +
'</p>' +
'</li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li></li>' +
'<li> </li>' +
'<li class="hxt"></li>' +
'<li class="hxt"></li>' +
'</ul></dd>');
}

Answer 1

楼上正解，移除了标签，标签上的事件也没了，添加新标签需要重新绑定时间，或者你不移除标签，清空标签内的内容也行