可排序的Jquery表在新的Jquery版本中不起作用

时间:2015-06-19 04:40:16

标签: jquery jquery-ui tablesorter jquery-ui-sortable

我有一个带有Jquery版本jquery-1.7.2的排序功能的表。当我将Jquery升级到jquery-1.11.1时,排序功能不起作用。我该如何解决这个问题?

这是我的HTML代码

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <table id="sort" class="grid table-bordered table-striped" title="Kurt Vonnegut novels">
        <thead>
            <tr><th class="index">No.</th><th>Year</th><th>Title</th><th>Grade</th></tr>
        </thead>
        <tbody>
            <tr><td class="index">1</td><td>1969</td><td>Slaughterhouse-Five</td><td>A+</td></tr>
            <tr><td class="index">2</td><td>1952</td><td>Player Piano</td><td>B</td></tr>
            <tr><td class="index">3</td><td>1963</td><td>Cat's Cradle</td><td>A+</td></tr>
            <tr><td class="index">4</td><td>1973</td><td>Breakfast of Champions</td><td>C</td></tr>
            <tr><td class="index">5</td><td>1965</td><td>God Bless You, Mr. Rosewater</td><td>A</td></tr>
        </tbody>
    </table>

这里是我的js

<script>
    var fixHelperModified = function(e, tr) {
    var $originals = tr.children();
    var $helper = tr.clone();
    $helper.children().each(function(index) {
        $(this).width($originals.eq(index).width())
    });
    return $helper;
},
    updateIndex = function(e, ui) {
        $('td.index', ui.item.parent()).each(function (i) {
            $(this).html(i + 1);
        });
    };

$("#sort tbody").sortable({
    helper: fixHelperModified,
    stop: updateIndex
}).disableSelection();
</script>

1 个答案:

答案 0 :(得分:2)

如果您升级jquery.ui.min.js,则使用onl jquery.min.js文件还必须升级jquery.ui.js文件尝试将此文件替换为: -

<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

以下是: - Demo