使用JQuery追加List值

时间:2015-10-04 09:57:43

标签: javascript jquery html

使用JQuery附加如何在按钮单击

上将列表值推送到另一个div部分

例如:

我有两个列表值

1.Adam  

2.Lance

如果我点击添加按钮,Adam值应该被添加到lance等的另一个div部分......等等

https://jsfiddle.net/oa2hfLum/3/

帮助我实现它谢谢!

HTML

<div>
<ol id="sortable">

</ol>
</div>

<div>
        <ul id="draggable">
            <li>
                <div>
                    <label class='lbl'>
                        Lance
                    </label>
                    <button>Add To Top container</button>
                </div>
            </li>
            <li>
                <div>
                    <label class='lbl'>
                        Adam
                    </label>
                    <button>Add To Top container</button>
                </div>
            </li>

        </ul>
    </div>

JQuery的

$(document).ready(function() {
    $("button").click(function () {
        $("#sortable").append('<li></li>');
    });
});

3 个答案:

答案 0 :(得分:1)

我认为你可以使用它:

$(document).ready(function() {
    $("button").click(function () {
        $("#sortable").append('<li>'+$(this).prev('label').text()+'</li>');
    });
});

演示:https://jsfiddle.net/oa2hfLum/4/

答案 1 :(得分:1)

您可以使用.prev().text()

获取label文字
$("button").click(function () {
    var label = $(this).prev().text();
    $("#sortable").append('<li>'+label+'</li>');
});

JSFiddle demo

答案 2 :(得分:1)

更改

$("#sortable").append('<li></li>');

$("#sortable").append('<li>'+$(this).parent().find('label').html()+'</li>');