Javascript JQuery 追加不起作用

Question

我正在尝试将一些内容动态添加到刚刚动态添加的某些内容中。我想将一堆 OPTION 项放入我刚刚添加的 SELECT 中。 SELECT 与外部 .php 文件中的一些代码一起添加(见下文)。这个 div 看起来很好。但是，我尝试在 SELECT 中添加的内容没有出现。我的 SELECT 根本就是空的。我没有收到任何错误。下面代码中的控制台输出检查并打印出我期望的结果。

这是 JavaScript 代码:

$.get("test-new-product-modal.php", function(data){
    $(".modal-body").html(data);
});
$divSelect = $("#product-list");
for(var i = 0; i<(arrayProductTypes.length); i++){
    $divOption = $("option", {'value' : i});
    $divOption.html(arrayProductTypes[i][0]);
    $divSelect.append($divOption);
    console.log("Product ID at "+i+" is: "+arrayProductTypes[i][0]);
}

这是我添加 HTML 的 .php 文件:

<div class="container-fluid no-padding">
    <div class="col-sm-6 col-md-6 col-lg-6">
        <h4>Välj en produkt.</h4>
        <select id="product-list" class="form-control">
            <!-- <option>DRA</option>
            <option>DRB</option> -->
        </select>

        <div class="divider-line"></div>

    </div>
    <div class="col-sm-6 col-md-6 col-lg-6">
        <p class="product-add-description">Text.</p>
    </div>
</div>

Answer 1

尝试 jQuery add() 方法

$.get("test-new-product-modal.php", function(data){
    $(".modal-body").html(data);
});
$divSelect = $("#product-list");
for(var i = 0; i<(arrayProductTypes.length); i++){
    $divOption = $("option", {'value' : i});
    $divOption.html(arrayProductTypes[i][0]);
    $divSelect.add($divOption);
    console.log("Product ID at "+i+" is: "+arrayProductTypes[i][0]);
}

您可以找到文档 here