追加无法使用optgroup向动态加载的选项列表添加选项

Question

将单个option附加到动态加载的select失败，没有任何错误。这是jQuery代码

$("#problem").load("docType.html");
$("#problem").append("<option value='All'>All</option>");

这会成功加载外部文件中选项组的选项，但无法附加'All'选项。没有错误或警告！

docType.html contents

<optgroup label="Billing">
<option value="Incorrect Bill" selected="selected">Incorrect Bill</option>
<option value="High Bill">High Bill</option>
</optgroup>
<optgroup label="Other">
<option value="Others">Others</option>
</optgroup>

Answer 1

您需要传递回调，因为load函数会发出异步请求。

$("#problem").load("docType.html", "", function() {
    $(this).append("<option value='All'>All</option>");
});

资源

• .load()

Answer 2

load()方法有一个可选的回调参数。

您可以在此处使用

$("#problem").load("docType.html",, function (){
    $("#problem").append("<option value='All'>All</option>")
});

jQuery开始加载docType.html并将All选项追加到#problem。但是这个追加在docType.html加载之前结束。

加载后，使用All选项覆盖原始内容。

希望它有所帮助。