none
Удалить выбранный элемент списка RRS feed

  • Вопрос

  • Как удалить выбранные элементы в списке? Попытался - не вышло.

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8" />
        <title>jQuery UI Selectable and Sortable</title>
        <!-- jQuery UI  |  http://jquery.com/  http://jqueryui.com/  http://jqueryui.com/docs/Theming  -->
        <style type="text/css">
            body
            {
                font: 62.5% Verdana,Arial,sans-serif;
            }
        </style>
        <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css"
            rel="stylesheet" type="text/css" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
        <style>
            ul
            {
                width: 300px;
                list-style: none;
                margin: 0;
                padding: 0;
            }
            li
            {
                background: white;
                margin: 1em 0;
                padding: 1em;
                border: 2px solid gray;
                list-style: none;
                padding-left: 42px;
            }
            li .handle
            {
                background: #f8f8f8;
                left: 0;
                top: 0;
                bottom: 0;
                padding: 8px;
            }
            .ui-selecting
            {
                background: #eee;
            }
            .ui-selecting .handle
            {
                background: #ddd;
            }
            .ui-selected
            {
                background: #def;
            }
            .ui-selected .handle
            {
                background: #cde;
            }
        </style>
        <script type="text/javascript">
            $(function () {
                $("#list")
                .sortable({ handle: ".handle" })
                .selectable()
                .find("li")
                .addClass("ui-corner-all")
                .prepend("<div class='handle'><span class='ui-icon ui-icon-carat-2-n-s'></span></div>");
    
    
                $("#but1").click(function () {
                    $(".ui-selected", this).each(function () {
                        $("#list li").remove();  
                    });
                });
    
    
            });
    
        </script>
    </head>
    <body>
        <ul id="list">
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item 3</li>
            <li>Item 4</li>
            <li>Item 5</li>
        </ul>
        <input type='button' id='but1' value='delete' />
    </body>
    </html>



    • Изменено Boguyang 16 декабря 2012 г. 13:23
    16 декабря 2012 г. 13:22

Ответы

Все ответы

  • Попробуйте так:

    $("#but1").click(function () {
              $(".ui-selected").each(function () {
                $(this).remove();
              });
            });

    • Предложено в качестве ответа Abolmasov DmitryModerator 18 декабря 2012 г. 7:11
    • Помечено в качестве ответа Boguyang 18 декабря 2012 г. 7:45
    16 декабря 2012 г. 14:56
    Модератор
  • Привет.

    В будущем лучше придерживаться правила один вопрос - одна тема, так будет понятнее не только обсуждающим, но и тем кто потом найдет данный вопрос, столкнувшись с подобной проблемой.

    Спасибо.


    Для связи [mail]

    18 декабря 2012 г. 7:11
    Модератор