1

我正在尝试将 jQuery-ui 的拖放与 angular js 一起用于手风琴列表......但是我的拖放在 jsFiddle 中不起作用（在本地服务器中工作），因为萤火虫指出： ReferenceError: jQuery is not defined 。

这是jsFiddle

               <!DOCTYPE html>
<html ng-app="App">

<title>Task WhiteBoard</title>
<head>
<meta charset="utf-8" />     
<meta name="description" content="AngularJS + jQuery UI Drag-n-Drop" />
<title>Angular Drag and Drop</title>
</head>


<body ng-controller="dndCtrl" ng-cloak>
<h3>Task Whiteboard</h3>


<div class='list1' droppable value='1' >    

<div class='header'>
    Free Tasks
</div>

<div class="below-header">

</div>

<div  ng-repeat="item in list1" data-index="{{$index}}" draggable>
    <div class="zippy" zippy-title="{{item.name}}">
            {{item.content.newLabel}}    <br/>
            {{item.content.desc}}    <br/>
            {{item.content.effort}}    <br/>
            {{item.content.owner}}    <br/>
            {{item.content.issues}}    <br/>    
            {{item.content.comments}}    <br/>
            {{item.content.dependency}}    <br/>
    </div>    
</div>    
</div>    

<div class='list2' droppable value='2'>    

<div class='header'>
    Claimed Tasks
</div>

<div class="below-header">

</div>

<div ng-repeat="item in list2" data-index="{{$index}}" draggable>
    <div class="zippy" zippy-title="{{item.name}}">
            {{item.content.newLabel}}    <br/>
            {{item.content.desc}}    <br/>
            {{item.content.effort}}    <br/>
            {{item.content.owner}}    <br/>
            {{item.content.issues}}    <br/>    
            {{item.content.comments}}    <br/>
            {{item.content.dependency}}    <br/>
    </div>    
</div>    
</div>

<div class='list3' droppable value='3'>

<div class='header'>
    Completed Tasks
</div>

<div class="below-header">

</div>

<div ng-repeat="item in list3" data-index="{{$index}}" draggable>
        <div class="zippy" zippy-title="{{item.name}}">
            {{item.content.newLabel}}    <br/>
            {{item.content.desc}}    <br/>
            {{item.content.effort}}    <br/>
            {{item.content.owner}}    <br/>
            {{item.content.issues}}    <br/>    
            {{item.content.comments}}    <br/>
            {{item.content.dependency}}    <br/>
        </div>    
</div>
</div>    


<div style="clear:both;">
    list 1 size : {{list1.length}}    <br/>
    list 2 size : {{list2.length}}    <br/>
    list 3 size : {{list3.length}}    <br/>
</div>
</body>
</html>
4

2 回答 2

1

看一下左侧面板JSFiddle，您已经选择了Pure JS，如果您想使用 Jquery UI，请选择并选中下方jquery version 1.7.2的复选框。jquery UI 1.8.18

于 2013-01-02T05:52:08.307 回答
0

您的托管资源出现故障。你需要先用jquery重新排序，然后用jquery ui等。这样就可以解决jQuery未定义的JS错误。

于 2013-01-02T05:48:08.327 回答