jQuery可排序（如何自定义可排序框内的可单击区域）

我有这个jQuery代码：

$(".right_box_holder").sortable({ 
        update : function () { 
            var order = $('.right_box_holder').sortable('serialize'); 
            $.get("right_menu_functions.php?change_sortorder&"+order);
        }   
    });

这个HTML代码：

<div class='right_box_holder'>
  <div class='right_box' id='box_0'>
    // sort box 0
  </div>
  <div class='right_box' id='box_1'>
    // sort box 1
  </div>
  <div class='right_box' id='box_2'>
    // sort box 2
  </div>
</div>

//排序框0
//分拣箱1
//分拣箱2

---

现在，我可以点击里面的任何地方。右键点击框并移动它。我想禁用此功能，并在.right\u框中创建一个按钮/图标，用户必须单击该按钮/图标才能拖动该框。这是可能的吗？

这实际上是Draggable的一个特性—由sortable使用

看一看。祝你好运

演示：

使用handle方法

$(".right_box_holder").sortable({ 
        handle: '.button_icon_or_css_sprite', // use the handle method
        update : function () { 
            var order = $('.right_box_holder').sortable('serialize'); 
            $.get("right_menu_functions.php?change_sortorder&"+order);
        }   
    });

<div class='right_box_holder'>
  <div class='right_box' id='box_0'>
    <img class="button_icon_or_css_sprite" />
  </div>
  <div class='right_box' id='box_1'>
    <img class="button_icon_or_css_sprite" />
  </div>
  <div class='right_box' id='box_2'>
   <img class="button_icon_or_css_sprite" />
  </div>
</div>

$（“.right\u box\u holder”）。可排序（{
句柄：'.button\u icon\u或\u css\u sprite'，//使用句柄方法
更新：函数（）{
变量顺序=$（'.right_box_holder'）。可排序（'serialize'）；
$.get（“right\u menu\u functions.php？change\u sortorder&“+order”）；
}   
});