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

标签 javascript jquery

我有一个函数可以克隆房间的详细信息并根据所选房间的数量进行追加。克隆后,我正在更改该房间中存在的每个元素的 ID。我能够成功更改两个下拉列表和一个标签的 ID。但我无法更改另一个下拉列表的 ID。请在这里帮助我。我找不到任何解决方案。

enter image description here

请找到已添加的图片。在这张照片中,我无法单独更改 child 年龄框的 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);
    }

}

最佳答案

错误是因为下拉列表的 id 中有一个额外的空格。删除该空间后一切正常。

关于javascript - 克隆后无法更改下拉列表的 ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46543248/

相关文章:

javascript - 如何将 ID 和字段值分配给隐藏字段

javascript - 如何使用 D3.js 设置下拉列表中的最后一个选项

javascript - Express 路由正则表达式生成的意外行为

javascript - 如何将 'Flexslider' 当前图像编号放入可在函数中使用的变量中?

javascript - 我如何计算函数在 jQuery 中花费的时间?

javascript - 我可以将 bootstrap 折叠更改为仅在单击图标时显示/展开吗?

javascript - javascript中的正则表达式替换函数

javascript - 哪种表达式更有效并且使用更少的内存?

Javascript - 我应该在需要特定接口(interface)的地方使用继承模型吗?

javascript - 如果单击 <li>,隐藏内部 div