Question

我必须使用ul li在div中附加dropdownlist。当我附加整个ul li字符串然后它看起来像[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>

我的jquery功能：

 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);       
}

https://jsfiddle.net/4uqgmqzc/3/

Answer 1

您正在尝试附加整个对象而不是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);
        });  
}

祝你好运!!

Answer 2

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

<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>

您的javascript代码将是

function createNewSelect2 () {
    $("#out").append("<li>" + $("select#sel :selected").text() + "</li>");
    $("select#sel :selected").remove();
}

FIDDLE

Answer 3

尝试像$("body").append(ddl[0]);

一样追加它

你想要追加的是一个jquery对象。基本上是所有选择元素的数组，在您的情况下只是一个。因此使用索引访问器来获取select语句并追加。

在Jquery中使用字符串附加下拉对象时遇到问题

3 个答案: