我有这个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>
