Javascript 将ul li列表转到多个选择字段

有一段时间，我在寻找一个解决方案，使多列表框或下拉框。我不知道这是否可行，但我想将生成的具有多个级别的ulli列表转换为mulit selectbox。有人能帮我吗

我通过此函数生成ul li：

{function displayCategories level=0 start=0 limit=null}

{if $level==0}<div class="catergie">{/if}
<ul class="nav{if $level==0}1{/if}">

    {foreach $category.categories as $subcategory}
        {if $subcategory@index < $start}{continue}{/if}

        {if empty($subcategory.categories)}
            <li>
                <a href="?listing_package_sid={$listing_package_sid}&amp;category_id={$subcategory.id}#listing-add-form-two">
                   <span class="nav-tabs">[[$subcategory.caption]]</span>
                </a>
            </li>
        {else}
            <li class="hasChild">
                <span class="nav-tabs notHover">[[$subcategory.caption]]</span>
                {displayCategories category=$subcategory level=$level+1}
            </li>
        {/if}
        {if !is_null($limit) && $limit + $start == $subcategory@iteration}</div>{break}{/if}
    {/foreach}
</ul>

{function displayCategories level=0 start=0 limit=null}
{if$level==0}{/if}

{foreach$category.categories as$subcategory}
{如果$subcategory@index<$start}{continue}{/if}
{如果为空（$subcategory.categories）}


{else}

[$subcategory.caption]]
{displayCategories category=$subcategory level=$level+1}

{/if}
{if！为空（$limit）&&$limit+$start==$subcategory@iteration}{break}{/if}
{/foreach}

{/函数}

我想把生成的列表放到列表框的下拉列表中

参见JSFIDLE：

---

谢谢

我建议使用jQuery库和菜单插件（）。那么转换就很简单了

<script>
  $(function() {
    $( ".nav1" ).menu();
  });
  </script>

$（函数（）{
$（“.nav1”）.menu（）；
});

---

您最好使用id来寻址顶级ul，而不是使用类名。

不要这样尝试，您可以使用引导多选择下拉菜单。。检查一下。。