jquery拖放问题:drop()函数永远不会被调用

时间:2022-08-23 11:33:45

I'm having trouble with the droppable effect in jquery 1.3.1 (UI version 1.5.3). As far as I can tell, everything works perfectly except the drop() function doesn't get called. I can tell the droppable target is accepting the element being dragged (via the thumbnail class), but the draggable item won't drop. Thanks for your help in advance!

我在jquery 1.3.1(UI版本1.5.3)中遇到了droppable效果问题。据我所知,除了drop()函数没有被调用之外,一切都很完美。我可以告诉droppable目标正在接受被拖动的元素(通过缩略图类),但是可拖动的项目不会丢失。感谢您的帮助!

<html>
<head>
<script type="text/javascript" language="javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript" language="javascript" src="/jquery/jquery.ui.js"></script>
<script type="text/javascript" language="javascript">
//<!--
    $(document).ready(function() {
        $('.drop_box').droppable({
            accept: '.thumbnail',
            activeClass: 'droppable-active',
            hoverClass: 'droppable-hover',
            drop: function (ev, ui) { 
                alert("Dropped!"); 
            }
        });

        $('#sample_thumbnail').draggable({ 
            helper: 'clone'
        });
    });
//-->
</script>
<style type="text/css">
    .drop_box {
        top:16px;
        width:250px;
        height:250px;
        border:1px solid #000000;
        float: right;   
    }
    .droppable-hover {
        background-color: #eeeeee;
        border: 1px solid red;
    }
    .droppable-active {
        background-color: orange;
        color: white;
        border: 1px solid blue;
    }
    .thumbnail {
        width:100px; 
        height:100px;
        border:1px solid green;
    }
</style>
</head>
<body>
<div class="drop_box">droppable</div>
<div id="sample_thumbnail" class="thumbnail">draggable</div>
</body>
</html>

2 个解决方案

#1


"jquery 1.3.1 (UI version 1.5.3)"

“jquery 1.3.1(UI版本1.5.3)”

You should not be using this pair of versions. JQuery 1.3.x is not compatible with the UI 1.5.x series, and requires the 1.6 release candidates. The release candidate versions are quite stable if you just want the drag and drop functionality; I wouldn't be concerned at all for using them in production. I only use drag and drop, so I can't comment on the stability of the rest of the 1.6 branch of UI.

你不应该使用这对版本。 JQuery 1.3.x与UI 1.5.x系列不兼容,需要1.6版本候选版本。如果您只想要拖放功能,那么候选版本的版本非常稳定;我不会担心在生产中使用它们。我只使用拖放,所以我无法评论UI的其余部分的稳定性。

#2


I don't have any problems with your code on either Mac/Safari or Mac/Firefox using jQuery 1.2.6 and jQuery UI 1.5.3. I think your issue is with incompatible versions.

我使用jQuery 1.2.6和jQuery UI 1.5.3在Mac / Safari或Mac / Firefox上的代码没有任何问题。我认为您的问题是版本不兼容。

#1


"jquery 1.3.1 (UI version 1.5.3)"

“jquery 1.3.1(UI版本1.5.3)”

You should not be using this pair of versions. JQuery 1.3.x is not compatible with the UI 1.5.x series, and requires the 1.6 release candidates. The release candidate versions are quite stable if you just want the drag and drop functionality; I wouldn't be concerned at all for using them in production. I only use drag and drop, so I can't comment on the stability of the rest of the 1.6 branch of UI.

你不应该使用这对版本。 JQuery 1.3.x与UI 1.5.x系列不兼容,需要1.6版本候选版本。如果您只想要拖放功能,那么候选版本的版本非常稳定;我不会担心在生产中使用它们。我只使用拖放,所以我无法评论UI的其余部分的稳定性。

#2


I don't have any problems with your code on either Mac/Safari or Mac/Firefox using jQuery 1.2.6 and jQuery UI 1.5.3. I think your issue is with incompatible versions.

我使用jQuery 1.2.6和jQuery UI 1.5.3在Mac / Safari或Mac / Firefox上的代码没有任何问题。我认为您的问题是版本不兼容。