ITPub博客

首页 > 应用开发 > > 关于js select onchange事件无法触发的问题

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

作者:chinarocky 时间:2019-08-14 14:01:14 0 删除 编辑

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

$(document).ready(function () {

//选择区域

$(".area").on('change', function () {

var node=$(this).parent().parent().find(".floor");

node.empty();

$(node).append(' 请选择楼盘 ');

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(' ' + data[i].proname + ' ')

}

});

});//选择楼盘

    $(".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>');
}


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4547/viewspace-3131632/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2019-07-10

  • 博文量
    213
  • 访问量
    1690