javascript 如何检查列表是否可排序?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11599758/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 13:46:55  来源:igfitidea点击:

How to check if list is sortable?

javascriptjqueryjquery-uijquery-ui-sortable

提问by user1502679

How to check if a specific list is sortable? Like $('#list').is(':sortable')... ?

如何检查特定列表是否可排序?比如$('#list').is(':sortable')……?

If we will use

如果我们将使用

if ($('#list').sortable()) 

then the list will be made sortable again and not check if actually it is sortable.

然后列表将再次可排序,而不检查它实际上是否可排序。

回答by xdazz

If the list is already sortable, then it should have class ui-sortable.

如果列表已经可以排序,那么它应该有 class ui-sortable

You could use if ($('#list').hasClass('ui-sortable'))to check it.

你可以if ($('#list').hasClass('ui-sortable'))用来检查它。

回答by jebbie

I just found out, with the data-interface it is working too:

我刚刚发现,数据接口也能正常工作:

if ($( '#sortable' ).data( 'sortable' )) {
    // sortable instance exists
}

回答by Frank

There was a change in jQuery Version after 2012, so now you can write:

2012 年之后 jQuery 版本发生了变化,所以现在您可以编写:

if ($( '#sortable' ).data( 'ui-sortable' )) {
    // sortable instance exists
}

or

或者

if ($( '#sortable' ).is(':ui-sortable')) {
    // sortable instance exists
}

回答by Hoogs

I found in Safari (maybe others) the classes are not reliable. 'ui-sortable' remains on any item which has been made sortable even if you disable it, which results in the classes 'ui-sortable ui-sortable-disabled' both being used.

我在 Safari(也许是其他人)中发现这些类不可靠。'ui-sortable' 仍然保留在任何已设置为可排序的项目上,即使您禁用它,这会导致类 'ui-sortable ui-sortable-disabled' 都被使用。

I found myself adding and removing the classes myself just to make sure they were as I expected.

我发现自己添加和删除类只是为了确保它们符合我的预期。

if ($(this).hasClass("ui-sortable")) {
  $(this).removeClass("ui-sortable");
  $(this).sortable({ disabled: true });
}
else {
  $(this).addClass("ui-sortable");
  $(this).sortable({ disabled: false });
}

-- EDIT

- 编辑

Ok, so the classes are reliable but what I was after is not disabled but rather .sortable("destroy") which returns the element to it's state prior to initialisation (i.e removes all helper classes).

好的,所以这些类是可靠的,但我所追求的不是禁用而是 .sortable("destroy") 它将元素返回到初始化之前的状态(即删除所有帮助类)。

So for my sortable toggle (which is what I was creating):

所以对于我的可排序切换(这是我正在创建的):

if ($(this).hasClass("ui-sortable")) $(this).sortable("destroy");
else $(this).sortable();

回答by Antguider

When applying Sorting, just add a dummy class to that element like this,

应用排序时,只需像这样向该元素添加一个虚拟类,

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

then, If you want to check the element is sortable then check like this,

然后,如果您想检查元素是否可排序,请像这样检查,

if($( "#sortable" ).hasClass("antguider")){
    alert("Already Sort Applied");
}

回答by Yosiet Serga

You can check my answer here https://stackoverflow.com/a/57549308/4175975

你可以在这里查看我的答案https://stackoverflow.com/a/57549308/4175975

Just call an instance of sortable, if return undefined, then is not loaded

只调用sortable的实例,如果返回undefined,则不加载

if (typeof $("ul.sortable").sortable('instance') != 'undefined') {
    //$.ui.sortable is loaded and called
} else {
    //call sortable
}

回答by code14214

You can also use:

您还可以使用:

Sortable.get(element)

https://github.com/SortableJS/Sortable#sortablegetelementhtmlelementsortable

https://github.com/SortableJS/Sortable#sortablegetelementhtmlelementsortable

It resolves to undefinedif no sortable instance is attached.

undefined如果没有附加可排序的实例,它会解析为。