Question

我可以拖动内容，但我无法将内容放入td。请帮帮我。如果从列表中拖动内容并放入td，则不会发出丢弃的警报。

我的jquery：

$(".items").draggable({helper: 'clone'});     
    $(".droparea").droppable({
       accept: '.items',
       drop: function(){
            alert('dropped')   

       }

       });

此处从列表中拖动内容。

<div class="listOfTeacher fl">
<ul>
<li class="items" id="1">Teacher1</li>
<li class="items" id="2">Teacher2</li>
<li class="items" id="3">Teacher3</li>
<li class="items" id="4">Teacher4</li>
</ul>
</div>

我必须将内容放入td

<table border="0" width="400" id="table" style="">
<tbody>
<tr id="aa">
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
</tr>
</tbody></table>

Answer 1

您的代码适合我。你确定加载了jquery.droppable lib吗？表格边框= 0也有效。

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-ui.js"></script>
<script type="text/javascript">
$().ready(function() {
    $(".items").draggable({helper: 'clone'});     
    $(".droparea").droppable({
        accept: '.items',
        drop: function(){
            alert('dropped')   
        }
    });  
});
</script>
</head>
<body>

<div class="listOfTeacher fl">
<ul>
<li class="items" id="1">Teacher1</li>
<li class="items" id="2">Teacher2</li>
<li class="items" id="3">Teacher3</li>
<li class="items" id="4">Teacher4</li>
</ul>
</div>

<table border="1" width="400" id="table" style="">
<tbody>
<tr id="aa">
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
<td class="droparea br">&nbsp;</td>
</tr>
</tbody></table>

</body>
</html>

我使用jquery有droppable的问题

1 个答案: