Javascript 在Jquery中附加带字符串的下拉对象时遇到问题

我必须用ulli在div中添加dropdownlist。当我附加整个ulli字符串时，它看起来像[object object]，好像我只附加下拉列表，然后它作为正确的html下拉控件出现。 有没有办法用字符串附加下拉列表

我的Html:

<select id='sel'>
  <option value='1'>Option 1</option>
  <option value='2'>Option 2</option>
  <option value='3'>Option 3</option>
  <option value='4'>Option 4</option> 
</select>
<a id="aselect" onclick="createNewSelect('#sel');">Add</a>

 function createNewSelect(a) {    
    var selVal = $(''+ a +'').val();
    var ddl = $(''+ a +'').clone();
    $('select').each(function() {
        $(ddl).find("option[value='"+ selVal +"']").remove();            
    });
    var newId = 'sel' + $('select').length;
    $(ddl).attr('id',newId);            
    $('#aselect').attr("onclick","createNewSelect('#"+ newId +"')");

    $("body").append("<li class=\"span3 no-margin\"><span>Social Media</span><br>" + ddl + "</li>");
    $("body").append(ddl);       
}

选择1
选择2
选择3
选择4
尝试像这样附加它
$（“body”）.append（ddl[0]）

您试图附加的是一个jquery对象。基本上是所有select元素的数组，在您的示例中，这些元素只是一个。因此，使用索引访问器获取select语句并追加
 您试图附加整个对象而不是html，您需要更新代码，如下所示

function createNewSelect(a) {    
        var selVal = $(''+ a +'').val();
        var ddl = $(''+ a +'').clone();
        $('select').each(function() {
            $(ddl).find("option[value='"+ selVal +"']").remove();            
        });
        var newId = 'sel' + $('select').length;
        $(ddl).attr('id',newId);            
        $('#aselect').attr("onclick","createNewSelect('#"+ newId +"')");

        $("body").append("<li class=\"span3 no-margin\"><span>Social Media</span><br>" + ddl[0].outerHTML + "</li>");

        $(ddl).change(function() {
            createNewSelect(this);
        });  
}

函数createNewSelect（a）{
var selVal=$（''+a+''）.val（）；
var ddl=$（''+a+''）.clone（）；
$（'select'）。每个（函数（）{
$（ddl）.find（“option[value='”+selVal+']）.remove（）；
});
var newId='sel'+$（'select'）.length；
$（ddl）.attr（'id'，newId）；
$（'#aselect'）.attr（“onclick”，“createNewSelect（'#“+newId+”）”）；
$（“body”）.append（“
“+ddl[0]。outerHTML+”
”；
$（ddl）.change（函数（）{
createNewSelect（这个）；
});  
}

祝你好运
 您需要将代码段更改为简单回调。您的代码片段将是

<select id='sel'>
    <option value='1'>Option 1</option>
    <option value='2'>Option 2</option>
    <option value='3'>Option 3</option>
    <option value='4'>Option 4</option> 
</select>
<a id="aselect" onclick="createNewSelect2('#sel');">Add</a>
<ul id="out"></ul>


选择1
选择2
选择3
选择4
您试图创建的输出是什么？上面的代码只是示例。我已经做了附加整个ul李和其他输入下拉列表。所以它看起来像“下拉文本框addbutton”。因此，当我单击addbutton时，它将再次生成“下拉文本框”。请尝试ddl[0]。outerHtml，检查我的答案。我不知道人们为什么给减号。这个问题怎么了？
function createNewSelect2 () {
    $("#out").append("<li>" + $("select#sel :selected").text() + "</li>");
    $("select#sel :selected").remove();
}