目前我有一组div,由php动态生成,所有的id都以'itembox'开头,并附加一个计数。我在页面上有一个可放置的垃圾桶区域,以便用户可以通过fdragging删除单个itembox并放入bin。

我的问题是,当我拖动原始文件时,droppable似乎不会激活,而当我有帮助时它将完美地运行:'clone'设置。不幸的是,在拖动时,克隆函数从itembox的第一次迭代中获取它的克隆,无论实际拖动哪个itembox。

所以我正在寻找一种解决方案,要么让droppable接受原始版本,要么强制克隆函数从实际拖动的itembox中取出它的克隆。

有帮助吗?

解决方案

我想这个问题必须在你的droppable初始化程序的accept选项中。试试以下内容:

$('#mydroppable').droppable(
{
    accept: function() { return true; },
    drop: function () { alert("Dropped!"); }
});

现在这将接受所有内容,所以你应该在accept函数中实现一些过滤,但是这应该可行。

其他提示

您也可以尝试以下解决方案。

<script type="text/javascript">
$(document).ready(function(){
    $('.srcfield').draggable({
        revert: true    
    });

    $('#trash').droppable({
        accept : ".srcfield",
        over: function(){
            $(this).removeClass('out').addClass('over');
        },`enter code here`
        out: function(){
            $(this).removeClass('over').addClass('out');
        },
        drop: function(ev, ui){
            //var answer = confirm('Delete this item?');
            var theTitle = $(ui.draggable).attr("title");
            $(this).html("<u>"+theTitle+"</u><br/> is deleted!");
        }
    });
});
</script>


<body>
    <div id="trash" class="out">
            <span>Trash</span>
    </div>
    <div id="sourcefields">
            <div class="srcfield" title="First Name"><span>First Name</span></div>
            <div class="srcfield" title="Last Name"><span>Last Name</span></div>
            <div class="srcfield" title="Age"><span>Age</span></div>
    </div>
</body>
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top