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