Question

我构建了拖放系统，但是当我尝试排序元素时，我得到了错误

未捕获的TypeError：无法读取属性＆＃39; top＆＃39;未定义的 at e。（匿名函数）。（匿名函数）._ mouseDrag（jquery-ui.min.js：12：536） at e。（匿名函数）。（匿名函数）._ mouseDrag（jquery-ui.min.js：6：7983） at e。（匿名函数）。（匿名函数）._ mouseStart（jquery-ui.min.js：12：191） at e。（匿名函数）。（匿名函数）._ mouseStart（jquery-ui.min.js：6：7983） at e。（匿名函数）。（匿名函数）._ mouseMove（jquery-ui.min.js：6：15443） at e。（匿名函数）。（匿名函数）._ mouseMove（jquery-ui.min.js：6：7983）在HTMLDocument.n._mouseCapture._mouseDistanceMet._mouseDelayMet._mouseMoveDelegate（jquery-ui.min.js：6：14949）在HTMLDocument.dispatch（jquery-2.1.1.min.js：3：6404）在HTMLDocument.r.handle（jquery-2.1.1.min.js：3：3179）

在我的HTML中我得到了很多＆＃39;阻止＆＃39; divs，都是空的。我的代码：

$('#elements_Button').on('click', function(){
    var origin = 'sortable';
    //var $iframe = $('#courseBuilder_PageFrame');
    $('.card-element').draggable({
           helper: function(e) {
               return $('<div>').addClass('block').text($(e.target).text()));
           },
           containment:'body',
            iframeFix: true,
            connectToSortable:$('#courseBuilder_PageFrame').contents().find('.container').sortable({
                iframeFix: true
            }),
        //  revert: "invalid",
            start: function () {
                 origin = 'draggable';
             }
        });
    $('#courseBuilder_PageFrame').contents().find('.container').droppable({
        iframeFix: true,
        drop: function (event, ui) {
                 if (origin === 'draggable') {
                     ui.draggable.html(Course.getElementByName(ui.draggable.text()));
                     console.log(ui.draggable);
                     origin = 'sortable';
                 }
             }

        });
});

HTML：

<div class="row block card-content card-element ui-draggable ui-draggable-handle">
<span class="card-title activator grey-text text-darken-4">Header</span>

<div class="container ui-sortable ui-droppable">            
    <div class="row block card-content card-element ui-draggable ui-draggable-handle" style="display: block;">
        <div class="col l12 m12 s12 header2">                   
        <h1 class="4s-editable">C-40Ai Aircraft</h1>                
    </div>          
</div>
....

这里是jsfiddle http://jsfiddle.net/w9L3eorx/39/

我认为我的jquery版本不适合......

Answer 1

解决方案是使用最新版本的jquery-ui v1.12.1。

jquery sortable无法读取属性＆＃39; top＆＃39;

1 个答案: