jqueryui可以用键盘排序？

Question

我需要通过键盘而不仅仅是鼠标来访问应用程序功能.该应用程序使用jquery sortable来管理有序列表.任何人都可以建议如何通过键盘提供排序功能的想法？我正在谈论基本的排序,如http://jqueryui.com/sortable上的示例所示.我还没有看到jqueryui/sortable上提到的任何内容,这让我相信框架没有内置的键盘支持.或者,是否有任何其他支持键盘的java脚本排序框架？

Answer 1

通过使用以下内容可以让它正常工作：

1. 为列表中的所有项目添加了 tabindex。这允许用户通过选项卡来浏览各个列表项。

2. 添加了以下js：

   $('.sortable li').focus(function() {
      $(this).addClass("ui-selecting");
   }); 
   $('.sortable li').focusout(function() {
      $(this).removeClass("ui-selecting");
   }); 
   
   
   $('.sortable li').bind('keydown', function(event) {
         ...
   
        if(event.which == 38) //up
           pseudocode:
            <current.text := previous.text>
            <current.data := previous.data>
            <previous.text := current.text>
            <previous.data := current.data>
   
            <set_focus(previous)>
   
        if(event.which == 40)
           pseudocode:
            <current.text := next.text>
            <current.data := next.data>
            <next.text := current.text>
            <next.data := current.data>
   
            <set_focus(next)>
   

因此，使用选项卡可以导航到项目并在项目中移动，而箭头则可以在列表中上下移动项目。它确实有效，但与使用鼠标拖放移动图形相比，它看起来当然很原始。想知道我是否可以以合理的努力来动画化这个动作......