Android 未调用JQuery drop函数

我有简单的从一个表到另一个表的拖放功能，从外观上看效果很好，但我的拖放方法似乎没有被调用

这是JQuery

<script>
  $(document).ready(function() {

  var $tabs=$('#table-draggable2')
  $( "tbody.connectedSortable" )
    .sortable({
        connectWith: ".connectedSortable",
        items: "> tr:not(:first)",
        appendTo: $tabs,
        helper:"clone",
        zIndex: 999990
    })
    .disableSelection();

   var $tab_items = $( ".nav-tabs > li", $tabs ).droppable(
   {
     accept: ".connectedSortable tr",
     hoverClass: "ui-state-hover",

     drop: function( event, ui ) 
    {
       alert("here!");
       return false;
    }
   });

   });
</script> 

这两个表只是设置ID

<table id='table-draggable1'
 ......
<table id='table-draggable2'
 .......

拖放在视觉上运行良好，但我在drop方法中放置了一个警报，它从未显示，为什么drop方法没有被调用

<table id='table-draggable1'>  
            <tbody class="connectedSortable">  
                <tr>
                    <th>col1</th>
                    <th>col2</th>  
                    <th>col3</th>  
                    <th>col4</th>  
                </tr>
                <tr>   
                    <td>156</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>256</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table>
        <table id='table-draggable2'>  
            <tbody class="connectedSortable">  
                <tr>
                    <th>COL1</th>  
                    <th>COL2</th>  
                    <th>COL3</th>  
                    <th>COL4</th>  
                </tr>
                <tr>   
                    <td>356</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>456</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table> 

---

如果我看一下你的HTML，这个选择器$.nav tabs>li$tabs不会返回任何元素，因此不会初始化可拖放对象

---

我认为您正在寻找的选择器是$table-draggable1 tr，请参阅fiddle。

代码中的.nav tabs>li元素在哪里？您愿意分享更多的HTML吗？@Dario我已经用示例中的表进行了更新，我的表非常类似。如果我查看您的HTML，此选择器$.nav tabs>li，$tabs不返回任何元素，因此没有可拖放对象被初始化。请确保$.nav tabs>li、$tabs.length>0处于启用状态true@Dario谢谢，为什么它不返回任何元素？看起来我从中得到的提琴也不起作用，HTML中没有，对于.nav选项卡也是如此，所以jQuery不能只选择它们。我认为您正在寻找的选择器是$table-draggable1 tr？请看这里，虽然如果你玩小提琴，它会起作用，但并不总是像预期的那样起作用，消息也不会显示编辑可能是，我的小提琴只是为了更好地回答这个问题，而不是一个完全完整/经过测试的解决方案。

<table id='table-draggable1'>  
            <tbody class="connectedSortable">  
                <tr>
                    <th>col1</th>
                    <th>col2</th>  
                    <th>col3</th>  
                    <th>col4</th>  
                </tr>
                <tr>   
                    <td>156</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>256</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table>
        <table id='table-draggable2'>  
            <tbody class="connectedSortable">  
                <tr>
                    <th>COL1</th>  
                    <th>COL2</th>  
                    <th>COL3</th>  
                    <th>COL4</th>  
                </tr>
                <tr>   
                    <td>356</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td>  
                    <td>1.82</td>                                                                  
                </tr>  
                <tr>  
                    <td>456</td>                                                                                         
                    <td>668</td>                                                              
                    <td>100.95</td> 
                    <td>1.82</td>                                                                
                </tr>  
            </tbody> 
        </table>