克隆后无法更改下拉列表的ID

时间:2017-10-03 11:13:23

标签: javascript jquery

我有一个克隆房间细节的功能,并根据所选房间的数量追加。克隆后,我正在更改该房间中每个元素的ID。我能够成功更改两个下拉列表和一个标签的ID。但是我无法更改另一个下拉列表的ID。请帮帮我。我无法找到任何解决方案。

enter image description here

请找到添加的图片。在这张图片中,我无法单独更改儿童年龄框的ID。

    function dynamicRoom(rooms) {
    var i = parseInt($('div[id^="room"]:last').prop("id").match(/\d+/g), 10);

    for (i; i < rooms; i++) {
        var $div_room = $('div[id^="room"]:last');
        var num_room = parseInt($div_room.prop("id").match(/\d+/g), 10) + 1;
        var x = num_room - 1;
        var $klon_room = $div_room.clone().prop('id', 'room' + num_room);
        $klon_room.find('#ddlAdults' + x).attr("id", "ddlAdults" + num_room);
        $klon_room.find('#ddlChild' + x).attr("id", "ddlChild" + num_room);
        $klon_room.find('#childAgeCollapse' + x + 1).hide();
        $klon_room.find('#childAgeCollapse' + x + 1).attr("id", "childAgeCollapse" + num_room + 1);

        $klon_room.find('#ddlchildAge' + x + 1).attr('id', 'ddlchildAge' + num_room + '1'); //THIS is WHERE I FOUND ISSUEs

        $klon_room.find('#childAge' + x + 1).prop("id", "childAge" + num_room + 1);

        $klon_room.find('#labelRoom' + x).attr("id", "labelRoom" + num_room);
        $klon_room.find("div.childAgeClass" + x).detach();
        $klon_room.find('#labelRoom' + num_room).text('Room ' + num_room);
        $("#Clone").append($klon_room);
    }

}

1 个答案:

答案 0 :(得分:1)

错误是因为下拉列表的id中有额外的空格。移除那个空间后一切都很顺利。