为什么jQuery Selectable插件不能与foreach生成的列表一起使用？

Question

我目前正在开发一个MVC项目，并实现了jQuery Selectable插件。我在我的模型中的字符串，我有Split()下面笔者认为：

@{ 
    var size = Model.AvailableSizes.Split(','); 
    foreach (var item in size) 
    { 
     <ol class="ui-selectable" id="selectable"> 
      <li class="ui-selectable">@item</li> 
     </ol> 
    } 
} 

这里是我的观点定义的静态脚本：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#selectable").selectable(); 
    }); 
</script> 

的selectable jQuery插件成功生成<ol>小号对于每个项目，但我只能选择第一个项目而不是其他项目。问题是什么？

Answer 1

您应该将<ol>置于之外的循环。现在你正在创建一个N ol元素，它们内部只有一个li，全部使用相同的id，这两个HTML都是无效的，并且是问题的原因。

试试这个：

<ol class="ui-selectable" id="selectable"> 
    @{ 
     var size = Model.AvailableSizes.Split(','); 
     foreach (var item in size) 
     { 
      <li class="ui-selectable">@item</li> 
     } 
    } 
</ol>