javascript - 在 JQuery 中运行时添加 HTML 元素 - 未按预期工作

Question

我通过 Javascript 文件中的 AJAX 调用在运行时添加 HTML 元素。

我想使用组合框下拉元素来显示数据列表。为了实现这一目标，我在我的脚本文件中尝试如下所示。

    $("#myList").append("<select id=\"mlist\" >");

    for(var i=0;i<datas.length;i++){
        $("#myList").append("<option>"+datas[i]+"</option>");
     }

    $("#myList").append("</select>");

但是在浏览器中，它显示生成的元素为

<select id="mlist"> </select>
 <option>INDIA</option>
 <option>CHINA</option>
  <option>JAPAN</option>

我希望将选项插入到选择元素之间。有人建议我哪里做错了吗？

Answer 1

这不是你的做法..你需要找到已经附加的 <select>然后附加到它。

var slct =  $("#myList").append("<select id='mlist' />").find('#mlist'); // append the select and find it
for(var i = 0; i < datas.length; i++) {
    slct.append("<option />", { text: datas[i] }); // now append
}