从 sortable() 中获取 toArray 值

Question

我很确定我在这里做了一些愚蠢的事情，因为这似乎是一个非常基本的问题。

我在短列表上使用 sortable() 并希望 return 排序列表的 ID 数组。我的代码有效，我可以从函数内执行 console.log 以正确显示排序的 ID。但是，我一辈子都想不出如何让这个数组供全球使用。

这是我的代码：

  $(function() {
    var sortedGrades = [];
    $('#sortable').sortable({
        //connectWith: '.sortable-list',
        update: function(event, ui) {
            var sortedGrades = $(this).sortable('toArray');

            console.log(sortedGrades);

        },
        create: function( event, ui ) {
            var sortedGrades = $(this).sortable('toArray');

            console.log(sortedGrades);
        }

    });

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

});

如果我使用 sortedGrades = [] ; 全局声明 sortedGrades 数组，当我稍后尝试将它调用到另一个函数时，该数组是空白的。如果我不全局声明它，当我尝试调用它时它会报错为未定义。

有什么我遗漏的想法吗？

Answer 1

重写您每次重新声明的 var 关键字一个新的 sortedGrades 变量，该变量仅在您声明它的函数内可见。

试试：

$(function() {

    var sortedGrades = [];

    $('#sortable').sortable({
        //connectWith: '.sortable-list',
        update: function(event, ui) {
            sortedGrades = $(this).sortable('toArray');
            console.log(sortedGrades);
        },
        create: function( event, ui ) {
            sortedGrades = $(this).sortable('toArray');
            console.log(sortedGrades);
       }
    });

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

});

Answer 2

我已经修复了它，不过如果有人能向我解释为什么这样做有效，我会很感兴趣。

我将代码更改为：

    $('#sortable').sortable({

        update: function(event, ui) {
            sortedGrades = $(this).sortable('toArray');
            sortedGrades2 = sortedGrades ;
            console.log(sortedGrades);
        },
        create: function( event, ui ) {
            sortedGrades = $(this).sortable('toArray');
            sortedGrades2 = sortedGrades ;
            console.log(sortedGrades);
        }

    });

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


  });

});

（即我添加了 sortedGrades2 = sortedGrades; 行）

然后我将 sortedGrades2 调用到我的另一个函数中。我不明白为什么我必须这样做，但它有效。就目前而言，我认为这两个数组实际上都没有在任何地方声明。

从 sortable() 中获取 toArray 值

Getting toArray value out of sortable()

arrays

jquery

jquery-ui

jquery-ui-sortable