Question

我在使用jQuery UI的可排序功能时遇到了问题。滚动似乎不起作用。

如果第二个列表（列表是在tbody中的表行上创建的，并且每个tbody都是连接的）是不可见的，我希望它可以向它滚动以删除我的表行。

这是我的HTML设置：

<ul>
    <li>
        <ul>
            <li>
                <table class="treeleerling">
                    <tbody class="oder0">

                        <tr class="suborder0">

                        </tr>
                        <tr class="sub1order">

                        </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <li>
                <table class="treeleerling">
                    <tbody class="oder1">

                        <tr class="suborder0">

                        </tr>

                        <tr class="suborder1">

                        </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </li>
</ul>

和jQuery代码

$(document).ready(function() {
    $("#left tbody").sortable({
            connectWith : '#left tbody',
            scroll : true,
            scrollSensitivity: 40,
    });
});

排序工作正常，但滚动没有..我做错了什么或什么？

更新：我重构了代码，只使用列表中的列表项而不是表体中的表行。仍然会出现同样的问题

Answer 1

这可能不适用于您的情况，但我想我会将我的解决方案发布到我正在使用的jQuery可排序的scolling问题。我没有使用滚动div。为了使滚动工作，我不得不从样式表中删除这一行：

body {
  overflow-x: hidden; /* this line kept page scrolling from working */
}

我还将'sortment'选项设置为'document'（这使得项目不会被左/右拖离页面，这也是我需要的。）

Answer 2

我偶然发现了这一点。对你来说可能为时已晚，但对于未来的访客来说：

有这个问题，我不得不从我的CSS中删除以下行：

#sortable{overflow: auto;} /*delete this */

所以我想任何分配给sortable的溢出都可能是问题所在。

Answer 3

抱歉，由于我对jQuery UI库的理解有限，我无法检测到代码中的任何错误。顺便说一下，向下滚动到目标div的代码在哪里？

以下是解决此问题的另一种方法，使用另一个jQuery插件：ScrollTo。

使用它很简单，加载插件后，使用代码：

$.scrollTo('#your_target_element_id');

我一直在我的项目中使用它，jQuery 1.4.2似乎还可以。

希望这会有所帮助：）

为什么不在我的jQuery UI中滚动工作可排序？

3 个答案: