【问题标题】:how to figure out which list item has been dropped如何确定哪个列表项已被删除
【发布时间】:2012-02-11 08:05:07
【问题描述】:

我有 3 列。

<div id="catalog">
    <ul id="author">
        <li>Different Author names</li>
        ....
    </ul>
    <ul id="genre">
       <li>Different Genres</li>
    </ul>
    <ul id="publish">
       <li>Different Publishers<li>
    </ul>
</div>

我使用 jquery 将这些列表中的项目拖放到不同的列表购物车中

    $(function() {
        $( "#catalog li" ).draggable({
            appendTo: "body",
            helper: function( event ) {
                    return $( "<li class='bit-box'>" + $(this).text() + "</li>" );
            },
      cursorAt: { cursor: "move", top: 5, left: 5 }
        });
        $( "#cart ul" ).droppable({
            accept: ":not(.ui-sortable-helper)",
            drop: function( event, ui ) {
                $( this ).find( ".placeholder" ).remove();
        $( this ).find( "li:contains('" + ui.draggable.text()  + "')" ).remove();
                $( "<li class='bit-box'></li>" ).text(ui.draggable.text()).append("<a class='closebutton' href='#' onclick='$(this).parent().remove();'></a>").appendTo( this );
            }
        });

有什么方法可以确定被丢弃的项目属于哪个列表。

感谢您的帮助。

【问题讨论】:

  • 我编辑假设您在问题中发布的 html 是您的代码的一部分。另外,我认为你的 JS 有错误。

标签: javascript jquery drag-and-drop


【解决方案1】:

尝试在drop 处理程序中使用它:

ui.draggable.closest('ul').attr('id')

它应该给你一个被删除的项目所属的列表的 id。

【讨论】:

    【解决方案2】:

    您应该检查 $(this).parent().id 属性。如果你想要父列表的 id。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-10-26
      • 1970-01-01
      相关资源
      最近更新 更多