我能够找到所有演示都遵循这种模式:
<ol id="selectable">
<li class="ui-widget-content">Item 1</li>
<li class="ui-widget-content">Item 2</li>
    ..
</ol>
我尝试将列表的 ID 更改为唯一的,但它似乎不起作用。是否要求可选元素具有“可选”的 id 和 ID,如果是这样,您如何使多个列表可选?
我能够找到所有演示都遵循这种模式:
<ol id="selectable">
<li class="ui-widget-content">Item 1</li>
<li class="ui-widget-content">Item 2</li>
    ..
</ol>
我尝试将列表的 ID 更改为唯一的,但它似乎不起作用。是否要求可选元素具有“可选”的 id 和 ID,如果是这样,您如何使多个列表可选?
不需要使用 id。事实上,您也不需要使用 html 列表。
下面的示例使用 a<div>作为容器,<span>元素作为可选择项。
<div class="group">
  <span>Item 1</span>
  <span>Item 2</span>
  <span>Item 3</span>
</div>
<script>
  $(".group").selectable({ filter: 'span' });
</script>
下一个示例使用数据属性选择器[data-album]来定位多个容器。这些<p>元素中的每一个都将被转换为一个单独的可选择对象,它们的子<img>元素作为被选择者。
<p data-album="Vacation">
  <img src="..." />
  <img src="..." />
  <img src="..." />
</p>
<p data-album="Birthdays">
  <img src="..." />
  <img src="..." />
  <img src="..." />
</p>
<script>
  $("[data-album]").selectable({ filter: 'img' });
</script>
    操作代码为:
$(function() {
    $( "#selectable" ).selectable();
});
您可以替换#selectable为指向您想要选择的任何选择器。所以它不一定是一个ID。它可能是一个像.selectable.
使用类而不是元素。一个元素的类可以包含多个值。
只需更改 te 行
¥('selectable').selectable();
到
¥('idChosed').selectable();
对于您选择的每个元素