是否可以在ajax html的select标签中插入选项标签

Question

我有一个返回一堆选项标签的网址。我可以坚持我的$ .ajax成功：

function(html) {

} 

清空select标签后，我可以直接在select标签内推送所有选项标签吗？ 我的选择标签的名称为“SelectName” 我在想这样的事情：

$("select[name='selectName']").appendTo($(html));   // but this doesn't work

我的html看起来像这样（它只是选项标签，它来自网址options.apsx：

<option id="1">test1</option><option id="2">test2</option>...

Answer 1

我猜你正在寻找append()

$("select[name='selectName']").append(html);

使用appendTo尝试将选择列表附加到您的<options/>，这是您想要发生的事情。

jsfiddle上的示例。

Answer 2

你可以把这样的东西放到你的成功函数中：

$("select[name='selectName']").empty();
$(html).appendTo("select[name='selectName']");

假设html是函数返回的option标记集。

Answer 3

提出的解决方案：纯JavaScript AJAX解决方案

 //HTML
 <select id="category">
     <option value="0">--Please Select Category--</option>
 </select>  

 //Javascript onload Event
 <script> 
 window.onload = function(){
    var cat  = document.getElementById('category');     
    loadCat(cat);
 };  

 //Function that will assign Category to Element
 function loadCat(element)
     var e = element;
     var xhr = new XMLHttpRequest();
     var url = 'load_categories.php';
     xhr.open('GET',url, true);
     xhr.onreadystatechange = function(){
     if (xhr.readyState === 4 && xhr.status === 200) {
        var r = JSON.parse(xhr.responseText);
        for (var key in r) {
            if (r.hasOwnProperty(key)) {                
                var tempNode = document.createElement("option");                    
                tempNode.value = r[key];                    
                var textnode = document.createTextNode(r[key]);                     
                tempNode.appendChild(textnode);                   
                e.appendChild(tempNode);    
            }
        }
    }
    };
   xhr.send();
 }  
 </script> 

服务器必须返回基本的JSON对象。上面的示例将与服务器JSON Response：

一起使用

 //JSON RESPONSE FROM SERVER
 {"1":"Module","2":"Essential","3":"Security","4":"Improvement"}

Node Credit转到以下链接：

https://www.w3schools.com/jsref/met_node_appendchild.asp