Question

我有一个固定布局的网页。这是我的Html，

HTML

<div id="sortable" style="display: block;">   
    <fieldset style="float: left;">
         <table>
             <tbody>
                 <tr>               
                     <td><a href="#"><img src="Data/Images/2012_08_12_00_47_53_4753.jpg" style="border-color:#DDDDDD;border-width:2px;border-style:solid;width:50px;margin-left: 10px"></a></td>
                     <td><a href="#"><img src="Data/Images/2012_08_12_00_47_54_4754.png" style="border-color:White;border-width:2px;border-style:solid;width:50px;margin-left: 10px"></a></td>
                     <td><a href="#"><img src="Data/Images/2012_08_12_00_47_55_4755.jpg" style="border-color:White;border-width:2px;border-style:solid;width:50px;margin-left: 10px"></a></td>
                     <td><a href="#"><img src="Data/Images/2012_08_12_00_47_56_4756.jpg" style="border-color:White;border-width:2px;border-style:solid;width:50px;margin-left: 10px"></a></td>
                </tr>
            </tbody>
        </table>
    </fieldset>
</div>

现在在我的页面上我想要包含jquery sortable选项。我试过但失败了。这是我尝试过的：

的jQuery

$( "#sortable" ).sortable();

http://jsfiddle.net/JXqst/9/

Answer 1

这是你想要的伙伴。

参考this。

当您对td tr进行排序时，sortable的ID应为{{1}}

Answer 2

你必须像这样改变你的

$( "#sortable table tr" ).sortable();

DEMO

Answer 3

您也可以使用list而不是表。然后你可以使用它：

function setSortableDefault(list) 
{
    $(list).sortable({ opacity: 0.6, cursor: 'move', update: function() {
        var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; 
        $.post("sortDefault.php", order, function(theResponse){
            //$("#result").html(theResponse);
        });                                                              
    }                                 
    });
}

此函数集列表定义为 list 可排序，当您移动元素时，它变得有点透明，准备订单并执行一些PHP脚本（此处为sortDefault.php）。这是用于对接口和数据库中的元素进行排序的脚本的典型示例。

Answer 4

Sortable有你可以传递的som参数。

你可以通过定位tr元素

来实现

$("tr", "#sortable" ).sortable();

或者是td元素

的更高性能和限制

$("tr", "#sortable" ).sortable({
    items: "td"
});

我已更新您的jsfiddle http://jsfiddle.net/DoubleYo/JTmrT/

JQuery Sortable不支持div和图像

4 个答案: