Question

我正在尝试创建多组可选列表。 jQueryUI Selectable。需要帮助来分隔2组中的列表，每组3 li。目的是允许用户仅从同一组中进行选择，并且每组都应该放在一边。

<ol id="selectable">
  <!--set A -->
  <li class="ui-state-default">&nbsp;</li>
  <li class="ui-state-default">&nbsp;</li>
  <li class="ui-state-default">&nbsp;</li>
  <!--set B -->
  <li class="ui-state-default">&nbsp;</li>
  <li class="ui-state-default">&nbsp;</li>
  <li class="ui-state-default">&nbsp;</li>
</ol>

谢谢！

Answer 1

好的，这是工作小提琴：http://jsfiddle.net/omarjmh/9ur5xx4a/1/

请注意，我没有使css相同，你必须自己做那部分。

正确的代码非常简单，你需要制作两个列表，然后在它们上面有一个单独的“可选”ID：

<强> HTML

    <ol id="selectable">
        <!--set A -->
        <li class="ui-state-default seta">Hello &nbsp;</li>
        <li class="ui-state-default seta">Hello &nbsp;</li>
        <li class="ui-state-default seta">Hello &nbsp;</li>
    </ol>
    <ol id="selectable-1">
         <!--set B -->
        <li class="ui-state-default setb">Hello &nbsp;</li>
        <li class="ui-state-default setb">Hello &nbsp;</li>
        <li class="ui-state-default setb">Hello &nbsp;</li>
    </ol>

<强> JS

  $(function() {
    $( "#selectable" ).selectable();
    $( "#selectable-1" ).selectable();

  });

就是这样！有了这个，您一次只能选择每个列表中的<li>个标记之一。现在你可以把它变得漂亮......

jQuery多个可选列表项组

1 个答案: