如何找到 select 下拉列表的值和 ID，它是动态创建的并且存在于另一个元素中

Question

我尝试使用 jquery 动态创建一个矩形，在创建矩形后，我向其附加了一个 select drop-down，这两个操作都是动态完成的，并且 id 被分配给他们动态地。在提交数据时创建所有必需的矩形之后，我想读取每个矩形和每个矩形的 select 的值。我能够获得矩形的 id，但我无法获得每个矩形的 selected 值和 select 下拉列表的 id。我尝试了一些方法，但 none 成功了，因此在此处发布相同的内容：

function to create the replica of the rectangle and append select drop-down:

$('#DroppableCanvas').on('drop',function(event){
    event.preventDefault();
    var data    =   event.originalEvent.dataTransfer.getData("text/html");
    var nodeCopy = document.getElementById(data).cloneNode(true);
    nodeCopy.setAttribute("id", 'box'+NewBoxId);
    nodeCopy.classList.add('draggableAddedFields');
    nodeCopy.setAttribute("draggable",true);
    
    var SelectID        =   'select'+NewBoxId;
    var combo = $("<select></select>").attr("id", SelectID).attr("name", SelectID);
    
    $.each(BusinessStep, function (i, el) {
        combo.append("<option>" + el.text + "</option>");
    });
    
    $(nodeCopy).append(combo);
    
    event.target.appendChild(nodeCopy);
    NewBoxId++;
});

function to read each rectangle and all the added elements within each rectangle:

//After adding all the drag and drop fields with values submit them
$('#SubmitFields').on('click',function(){
    var AllFields       =   [];
    $(".draggableAddedFields").each(function() {
        var obj     =   new Object();
        obj.ID      =   this.id;
        console.log($(this.id).find("select"));
        AllFields.push(obj);
    });
})

当我尝试执行以下操作时，我得到了 jQuery 函数： console.log($(this.id).find("select"));

当我尝试这样做时，我得到了 undefined： console.log($(this.id).find("select").attr('id'));

在这种情况下，我想在这里找到每个元素 select 元素 id 并为 select 下拉列表选择 value。

由于 $(this.id) 属于外部矩形，因此我无法使用它来获取值。在大多数回复中，我搜索了他们有直接的要求，但就我而言，它似乎有点不同，因此发布。

Answer 1

要查找当前元素中的任何元素，请使用 $(this).find 而不是 $(this.id).find

要获取 draggableAddedFields 内 select 下拉列表的 ID 和值，请使用此

$(".draggableAddedFields").each(function() {
       var selectId =    $(this).find("select").attr('id')
       var selectValue = $(this).find("select").val()

如何找到 select 下拉列表的值和 ID，它是动态创建的并且存在于另一个元素中

How to find the value and id of select drop-down which has been created dynamically and which is present within the another element

javascript

jquery

jquery-selectors

dynamic-programming