Jquery UI-Selectable“Multiple Instances”

Question

这可能吗？我当然希望是这样。我有多个ui-selectable实例，当我点击它们时，我希望其他实例也可以关闭。目前它切换每个div中的一个。有没有办法修改我的javascript或其他东西让它们切换两个实例？

示例：

<script type='text/javascript'>
$(window).load(function(){
$(".ui-selectable").selectable();
});
</script>

<div class="ui-selectable">
<ul>
<li>text</li>
<li>text</li>
</ul>
</div>

<div class="ui-selectable">
<ul>
<li>text</li>
<li>text</li>
</ul>
</div>

Answer 1

试试这个：

$（'。ui-selectable'）。each（function（）{$（this）.toggle（）;}）;

Answer 2

问题是你正在使DIV可选，它应该是无序列表（ul）。这是一个演示：http://jsfiddle.net/H8fPL/21/。如果您还有其他需要，请告诉我。

修改

我认为这就是你要找的东西。以下是演示：http://jsfiddle.net/H8fPL/60/

我还提供了以下代码....

JAVASCRIPT：

$( ".selectable" ).selectable({
stop: function(event, ui) {
    var el_id = $(this).children("ul").attr("id");

    $("ul.ui-selected").not("#" + el_id).each(function(index, element) { 
       $(element).toggleClass("ui-selected");
        if($(element).children("li").hasClass("ui-selected")){
           $(element).children("li").removeClass("ui-selected");
           }
    });
}
});

HTML：

<div id="div1" class="selectable">
<ul id="ul1">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
</ul>
</div>
<div id="div2" class="selectable">
<ul id="ul2">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
</ul>
</div>