Question

我无法将图像从“表格a”拖放到“表格b”。我正在使用可排序的API进行拖放，问题一旦被放入'table a'，'table b'就无法从'table a'拖放到表b'。有人可以帮忙吗？这是我的示例代码......

 $( "tbody.table1" ).sortable({
    connectWith: ".table1a",
        items: "> tr td",
        appendTo: table2,
        helper:"clone",            
        start: function(){ $table1b.addClass("dragging") },
        stop: function(){ $table1a.removeClass("dragging") }
    })
    .disableSelection();

$( ".table1a",".table1b" ).droppable({
  accept: ".table1b tr td"  
  },
  drop: function( event, ui ) {
    return false;
  }
});

Answer 1

下面是一个示例代码，演示了两个列表之间的拖放：

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Demo</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

<script type="text/javascript">
  $(function () {
    $(".list1, .list2").sortable({
      connectWith: ".sortable"
    });
  });
</script>
 <style>
.sortable { list-style-type: none; list-style-position: inside;margin: 0px 12px 8px 0px; width: 60%; padding: 2px; border-width: 1px; border-style: solid; min-height: 100px;}
.sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1em; height: 18px; border: 2px dashed #d3d3d3 ;  background-color: #eee }
</style>
<div>
  <div">
    <ul class="list1 sortable">
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
      <li>Item 4</li>
      <li>Item 5</li>      
    </ul>
  </div>
  <div>
    <ul class="list2 sortable">
      <li>Item 6</li>
      <li>Item 7</li>
      <li>Item 8</li>
      <li>Item 9</li>
      <li>Item 10</li>
    </ul>
  </div>
</div>
</body>
</html>

希望这有助于解决您的问题。

单击here以检查在JsFiddle中实现的代码。

使用jquery在不同的表之间拖放？

1 个答案: