jquery - 如何使用 Jquery 动态创建带有 append 文本的 ul li

Question

我有一个表单，其中包含带有添加按钮的文本输入。当您单击添加按钮时，它会从输入中获取文本并将其放置在另一个 div 的下方。我需要它位于动态创建的无序列表中，该列表也将输入中的文本放置在其中。我需要的输出看起来像

<ul>
<li>text from input</li>
<li>text from input again</li>
</ul>

我不确定如何正确放置 append 内容以创建列表并在其中 append 文本。我可以轻松获取文本值并将其输出到列表中。任何有关 append 的帮助都会很棒。

Answer 1

HTML:

<input type="test" id="inputName" />
<button id="btnName">Click me!</button>

<ul class="justList"></ul>

JS:

$('#btnName').click(function(){
    var text = $('#inputName').val();
    if(text.length){
        $('<li />', {html: text}).appendTo('ul.justList')
    }
});

这是演示:

http://jsfiddle.net/J5nCS/

更新:

您的意见:

这是网址:

http://jsfiddle.net/J5nCS/1/

$('#btnName').click(function(){
    var text = $('#inputName').val() + '<button>x</button>';
    if(text.length){
        $('<li />', {html: text}).appendTo('ul.justList')
    }
});

$('ul').on('click','button' , function(el){
    $(this).parent().remove()
});