多个可选项，在进行任何选择后重置所有其他项

Question

我在一个网页中使用了多个jquery-ui-selectable。我希望选定的文本值显示在文本字段中。基本上，我设计了一个类别结构，其中我使用了accordion作为标题，并可选择为子类别。

我可以在文本字段中显示它，但问题是当我想从另一个accordion中选择项目时，上一个accordion中的项目的值被附加到文本字段中。这只是因为前一个accordion中的项目仍处于选中状态。我想在单击下一个accordion中的项目时，立即从上一个accordion中取消选择它。

Answer 1

如果我的问题是对的，那么您所需要做的就是实现一个更改处理程序。

示例代码可能如下所示：

$(".selectable").selectable({

    // change handler
    stop: function() {

        // reset all selected values in other selectables
        $('.selectable').not(this).find('li').removeClass('ui-selected');

        // print currently selected value(s)
        $('#result').val(
            $(".ui-selected").map(function() {
                return $(this).text();
            }).get().join(";")
        );
    }

});​

在这个FIDDLE中观看它的实况。