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

Answer 2

工作jsFiddle类似于你期望的东西：

添加像这样的HTML元素要简单得多：

.append('<option value="' + array[i] + '">' + array[i] + '</option>');

Answer 3

我相信你如何声明你的选项对象试试这个：

$divOption = $("<option>").attr('value',i);

Answer 4

您没有正确添加options。如果您想添加options，例如jquery object，您可以执行此操作

for (var i = 0; i < (arrayProductTypes.length) ; i++) {
     $divOption = $('<option></option>').val(i).html(arrayProductTypes[i][0])
     $divSelect.append($divOption);
     console.log("Product ID at " + i + " is: " + arrayProductTypes[i][0]);
 }

此行$divOption = $("option", {'value' : i});没有返回option对象，而是返回一个空数组，因此您需要使用

$('<option></option>').val(i).html("somehtml")返回option。

Javascript JQuery追加不起作用

4 个答案: