Question

如何追加data-mine的价值？（放弃后）

这是我的试试

的jQuery

$(function() {
    var transferred = false;
    $('#draggable li').draggable({
        connectToSortable: '#sortable',
        helper: 'clone',
    });

    $('#sortable').sortable();
});

HTML

<ul id="draggable">
    <li data-mine='hi'>Hello</li>
    <li data-mine='why'>Stack</li>
    <li data-mine='flow'>Overflow</li>
</ul>


<ul id="sortable"></ul>

Answer 1

您需要使用.draggable()的jQuery UI才能正常工作，因为常规jQuery没有.draggable()。只要确保你包含它，一切都应该正常。

另外，要在原始列表中获取data-mine属性，请在ui.item事件中使用receive，然后使用.attr()并将其保存在变量中。然后，要在新列表中附加data-mine属性，请在ui.item事件中使用stop，然后将.text()与前面提到的变量一起使用。

＆＃13;

$(function() {
    var transferred = false;
    $('#draggable li').draggable({
        connectToSortable: '#sortable',
        helper: 'clone',
    });

    var sortable = $('#sortable');
    //This is the data-mine attribute of the last object dropped in:
    var curDataMine;
    sortable.sortable({
        receive: function(event, ui) {
            transferred = true;
            //Here, we append the data-mine attribute onto the item in the original list:
            curDataMine = ui.item.attr("data-mine");
        },
        stop: function(event, ui)
        {
            transferred = true;
            //Here, we append the data-item attribute onto the item in the sortable list:
            ui.item.text(curDataMine);
        }
    });
});

＆＃13;

#draggable, #sortable {
    float: left;
    width: 100px;
    margin: 30px;
}

#draggable li, #sortable li {
    margin-top: 5px;
    background-color: #aaa;
}
#sortable {
    border: 1px solid red;
    width:100px;
    height:100px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script>
<ul id="draggable">
    <li data-mine='hi'>Hello</li>
    <li data-mine='why'>Stack</li>
    <li data-mine='flow'>Overflow</li>
</ul>


<ul id="sortable"></ul>

＆＃13;

在draggable中删除新对象

1 个答案: