如何将选项文本附加到jquery中的列表

时间:2010-10-05 18:01:47

标签: jquery appendto

我尝试过一些事情让这个没有运气。我有一个选择框,旁边有一个按钮。单击该按钮时,当前所选项目中的文本需要放在li标签内,并附加到另一个div内的ul。

<!--select box-->
<div class="select-div">
<select id="select-pub">
<option value="1">Publisher 1</option>
<option value="2">Publisher 2</option>
<option value="3">Publisher 3</option>
<option value="4">Publisher 4</option>
</select>
</div> 

<!--this button needs to append the currently selected text to a list-->

<div class="link-div">
<a class="add-button" href="#" style="width:46px;height:22px;display:block;"></a>
</div>

<!--the option text must now populate this unordered list-->

<div id="publisher-results">
<ul>
</ul>
</div>

我从这里开始,但是如何在li标签中获取文本并将其附加到ul?

<script type='text/javascript'>
$('.add-button').click(function() {

   $('#publisher-results ul').append($('#select-pub :selected').text());
   });
</script>

有什么想法吗?我整个下午一直都在失败!

1 个答案:

答案 0 :(得分:1)

您可以创建<li>设置文字并将其添加如下:

$('.add-button').click(function() {
  $('<li />', { text: $('#select-pub :selected').text() })
     .appendTo('#publisher-results ul');
});

You can test it out here,这会使用$(html, props)构造方法,然后使用.appendTo()将其放在<ul>内,它被分成2行,只是为了防止在SO上滚动,它不要在你的代码中分解。