Javascript 使用jQueryUI仅选择一个可选选项

我有一个序列化的可选项，我想要一个函数，使它一次只选择一个列表项。我相信我有正确的代码，但它不起作用。有人知道为什么吗

以下是我的javascript：

$(function() {
    $( "#selectable" ).selectable({
        stop: function() {
            var result = $( "#select-result" ).empty();
            $( ".ui-selected", this ).each(function() {
                var index = $( "#selectable li" ).index( this );
                result.append( " #" + ( index + 1 ) );
            });
        }
    });
});


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

下面是我在html中的选择。可能是由于

标记中嵌套的元素导致了问题

<ul id="selectable">
    <li><a><img src="images/CacheMenuGoogleCache2.png", alt="Google Cache" class="button" id="Google Cache" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuBingCache2.png", alt="Bing Cache" class="button" id="Bing Cache" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuYahooCache2.png", alt="Yahoo Cache" class="button" id="Yahoo Cache" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuWaybackMachine2.png", alt="WayBack Machine" class="button" id="WayBack Machine" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuCoralCDN2.png", alt="CoralCDN" class="button" id="CoralCDN" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuGigablast2.png", alt="Gigablast" class="button" id="Gigablast" height ="34px" /></a></li>
    <li><a><img src="images/CacheMenuWebCite2.png", alt="Webcite" class="button" id="Webcite" height ="34px" /></a></li>
</ul>

---

我感谢你的时间和帮助

好的，我发现了问题。我需要将其包含在函数中，如下所示：

$(function() {
    $("#selectable").selectable({
        selecting: function(event, ui){
            if( $(".ui-selected, .ui-selecting").length > 1){
                  $(ui.selecting).removeClass("ui-selecting");
            }
        }
    });
});

---

另外，您可能会注意到函数有点不同。这是因为另一个函数未选中图像。

好的，我发现了问题。我需要将其包含在函数中，如下所示：

$(function() {
    $("#selectable").selectable({
        selecting: function(event, ui){
            if( $(".ui-selected, .ui-selecting").length > 1){
                  $(ui.selecting).removeClass("ui-selecting");
            }
        }
    });
});

---

另外，您可能会注意到函数有点不同。这是因为另一个函数未选中图像。

当我在示例上尝试您选择的函数时，它似乎如预期的那样工作。当我点击一个项目时，它会被选中，而其他项目则会被取消选中。除非你期望其他东西？目标是一次只能选择一个项目。那对你有用吗-因为，我可以突出显示并选择多个。当我在示例上尝试您选择的函数时，它似乎按照预期工作。当我点击一个项目时，它会被选中，而其他项目则会被取消选中。除非你期望其他东西？目标是一次只能选择一个项目。那对你有用吗-因为，我可以高亮显示并选择多个。