我有这个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='ri
$(".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>
就像现在一样,我可以点击.right_box内的任何地方并移动它.我想禁用它并在.right_box中创建一个按钮/图标,用户必须单击该按钮/图标才能拖动该框.这可能吗?
演示: http://jsbin.com/iwufe4/edit使用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>