如何仅使用按钮而不是整行拖放？答案

【问题标题】：how to drag and drop only using button not by whole row?如何仅使用按钮而不是整行拖放？
【发布时间】：2014-05-29 14:26:30
【问题描述】：

我正在制作一个演示，用户可以在其中拖放行。在我的演示中，用户在任何地方（从行的整个宽度）保持行并放在另一个位置。我需要防止它只在用户拖放时在按钮区域。如果用户想要拖动行，它应该按住按钮区域并放在任何地方。

单击按钮后我正在创建行。现在我想防止仅在按钮区域中从整个宽度拖放。

这是我的小提琴

http://jsfiddle.net/FZQ8D/22/

$("#testCaseContainer").sortable({
          stop: function( event, ui ) {



          }
    }).disableSelection();

点击添加按钮后先创建 2 或 3 行。

然后它应该拖放到按钮区域。

谢谢

【问题讨论】：

jQuery UI Sortable 有一个句柄属性，它应该是一个选择器，用于识别启动元素拖放的对象。你试过用吗？
jsfiddle.net/FZQ8D/23 handle 属性的非常简单的测试，但它不适用于按钮，因为按钮不是可拖动的对象，所以我用丑陋的跨度代替。
@scragar 没试过。我不知道我也是第一次使用这个js ..你能用小提琴来制作吗。这样我可以更好地理解。
@scragar 感谢您的帮助..你能提供一个链接吗？所有 api 和事件都可用..
api.jqueryui.com/sortable

标签： javascript jquery jquery-ui jquery-mobile jquery-ui-sortable

【解决方案1】：

@scragar 给出了完美的答案。

$("#testCaseContainer").sortable({
        handle: '.editButton',
          stop: function( event, ui ) {

                      var obj={};
        var len=$("#testCaseContainer > div").length;
    // alert("all Index");
        for(var i=0;i<len;i++){
           // var id=
      //alert($("#testCaseContainer > div").eq(i).find('li').attr('id'));
            obj[i]=$("#testCaseContainer > div").eq(i).find('li').attr('id');

          //  alert($("#testCaseContainer > div")[0].find('li').id);

        }
console.log(obj)  

          }
    }).disableSelection();

【讨论】：