Jquery ui Jquery UI可选，如何仅选择一项？

有没有办法定义，jquery.selectable小部件只能选择一个项目

---

或者我必须完成一项工作来捕获事件并自行处理发生了什么？

我扩展了Nirmal的答案，以限制鼠标选择的大小写。另外，我觉得使用

selected

选项比使用完全独立的事件处理程序更为简洁

$("#myList li").click(function() {
  $(this).addClass("selected").siblings().removeClass("selected");
});

$("#selectable").selectable({
    selected: function(event, ui) { 
        $(ui.selected).addClass("ui-selected").siblings().removeClass("ui-selected");           
    }                   
});

---

还有一个小问题。用鼠标选择多个项目时，最后一个项目将始终处于选中状态。这是因为传递到

selected

选项中的函数是为每个选中的项目运行的，我假设它是按项目顺序运行的。理想情况下，您的鼠标光标落在的项目将被选中。我没有解决这个问题，因为我主要是想在使用鼠标时使用多重选择约束。

我稍微改进了mattblang的答案。兄弟姐妹也可以有后代，所以更一般的答案是：

---

是否要取消选择以前选定的项目？或者阻止选择第二个项目？我假装的是只选择一个项目，就像“下拉行为”或单选按钮一样。

selected

应该是

ui-selected

而且，这不处理鼠标选择的情况。+1这很好用。（在我的特殊情况下，项目没有后代。）要禁用套索中捕获的多个项目：

$（“#可选”）.selective（{selected:function（event，ui）{$（ui.selected）.addClass（“ui selected”）.sides（）.removeClass（“ui selected”）；}，selection:function（event，ui）{$（ui.selecting）.addClass（“ui-selecting”）.sides（）.removeClass（“ui-selecting”）；}，}；

这样更好…更好

$("#selectable").selectable({
    selected: function(event, ui) {
        $(ui.selected).addClass("ui-selected").siblings().removeClass("ui-selected").each(
            function(key,value){
                $(value).find('*').removeClass("ui-selected");
            }
        );
    }
});