javascript - jQuery 将 UL 与 LI 附加到按钮单击时下拉列表中的值

标签 javascript jquery jquery-ui

我有一个下拉列表:

<select id="ContentList" name="ContentList">
  <option value="">Please Select</option>
  <option value="TEST_TOP">TEST TOP</option>
</select>

我有一个可排序的列表:

<ul id="sortable">
  <li class="ui-state-default">First</li>
  <li class="ui-state-default">Second</li>
  <li class="ui-state-default">Third</li>
</ul>

我有一个按钮:

<input type="button" value="Add Section" id="btnAdd" class="button"/>

以及以下脚本:

<script type="text/javascript">
        $(function() {


            $("#sortable").sortable({
                placeholder: 'ui-state-highlight'
            });
            $("#sortable").disableSelection();

            $('#btnAdd').click(function() {

            });

        });

    </script>

当用户在下拉列表中选择某项并单击“添加”时,我希望将其作为 <li> 发送到可排序列表中使用类属性等,下拉菜单现在显示“请选择”选项。

不确定采取的最佳方法。谢谢

最佳答案

$("#sortable").append("<li class='ui-state-default'>"+
                          $("#ContentList option:selected").text()+"</li>");
$("#ContentList option:selected").remove();

应该可以解决问题...(:

关于javascript - jQuery 将 UL 与 LI 附加到按钮单击时下拉列表中的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1118870/

相关文章:

javascript - XSL 中的空元素 - 嵌套问题

javascript - 使用 <a href> 打开特定选项卡并保存到 localStorage

javascript - 我应该做什么才能在广度优先搜索算法中打印级别。

javascript - jQuery UI Slider - 根据选择而变化的自定义滑动按钮

javascript - 无法从内部函数检索 json 响应

jquery - IE9 无法识别自动完成功能

javascript - jQuery - 可调整宽高比仅适用于一个 handle

javascript - 多个 Node.js 请求

javascript - 选择未在 IE 中显示的选项

javascript - 如何在 jQuery Datepicker ui 中阻止多个日期范围