Question

我已经使用SO了很长一段时间才能得到我需要的答案，但是有了这个，我就碰壁了。我在HTML中有这个

<div id="items">
    <p id="howto">Add your shopping items below. Click "Add" or hit Enter</p>
    <input type="text" id="additem" name="additem" placeholder="Let's shop!">
    <button id="button">Add</button>
    <ul id="add">
        <li>Click to show it is done (it will move last)</li>
        <li>Double-click to delete</li>
        <li>Happy Shopping!</li>
    </ul>
</div>
<div class="last">
    <ul id="done">
        <li>Item done here</li>
    </ul>
</div>

这是关于jQuery：

$("#button").on("click", function(){
    var item = $("#additem").val();
    var list = "<li>" + item + "</li>";
    $("ul").prepend(list);
    $("#additem").val ("");
});

$(document).keypress(function(e){
    if (e.which==13) {
        $("#button").click();
    }
});

$("ul").on("click", "li", function(){
    $(this).append($("#done"));
});

$("ul").on("dblclick", "li", function(){
    $(this).remove();
});

想法：添加一个项目。单击该项目一次后，它将移至#done ul。问题：我的var列表添加了一个项目作为li，但它也会填充#done里面的li（其中只检查了项目）。我的初学者逻辑是，如果我在点击某个项目时出错，我可以轻松地将其从#done ul中检索回#add ul（如果这没有多大意义，希望这会：{{3} }）。我真的很想找到这个，但找不到答案。

谢谢！

编辑：我知道我应该定位var列表中的列表元素，但这是我被困住的地方（或者可能有更简单的方法）

Answer 1

你的附加方法错误，应该是：

$("ul").on("click", "li", function(){
    $("#done").append($(this));
});

JSFiddle

Answer 2

你应该改变：

$('ul').prepend(list);

要：

$('#add').prepend(list);

选择器$('ul')将在页面上找到所有<ul>元素，并根据jQuery命令应用于所有这些元素，或仅应用于找到的第一个元素。例如，prepend，append和wrap将应用于除html以外的所有内容，但仅适用于找到的第一个。

在特定的类/ id / jQuery中创建列表

2 个答案: