Question

我谦卑地问任何人，因为我在移动时遇到了麻烦（选项列表项目）：

<select class="list-of-users">
<option class="list-of-users">Sample Group</option>
<option class="list-of-users">TOP Group</option>
<option class="list-of-users">TEST Group</option>
<option class="list-of-users">AWD Group</option>
</select>

到此列表：

<ul class="list-of-members">
<li class="list-of-members"></li>
<li class="list-of-members"></li>
<li class="list-of-members"></li>
<li class="list-of-members"></li>
</ul>

到目前为止，我一直在圈子里跑。提前谢谢..

Answer 1

$('.list-of-users').on('change',function(){
  var value = $(this);

  $('ul.list-of-members').append('<li class="list-of-members">'+value.val()+'</li>')

});

如果这不是您想要的，请参阅下面的链接

How to convert <select> dropdown into an unordered list using jquery?

Answer 2

var ul = $("<ul/>").addClass("list-of-members");
$("option.list-of-users").each(function(){
   ul.append($("<li/>").html($(this).html()).addClass("list-of-members"));
});
$(".list-of-users").replaceWith(ul);

工作示例：http://jsfiddle.net/z3uU3/1/

Answer 3

试试这个，

<强> Live Demo

strToAppend = "";
$('option.list-of-users').each(function () {
    strToAppend += "<li>" + $(this).text() + "</li>";
});

$('ul.list-of-members').append(strToAppend);

Answer 4

尝试： Fiddle

var ul = $("<ul/>").addClass("list-of-members");
$('body').append(ul);
$('.list-of-users option').each(function () {
    $('ul').append($("<li/>").text($(this).text()).addClass("list-of-members"));
});

如何使用jquery将选项列表项移动到<ul>？</ul>

4 个答案: