移除& lt; LI>从& lt; UL>点击使用jQuery

Remove <LI> from <UL> on click using jQuery

本文关键字：lt jQuery LI 移除 UL 更新时间：2023-09-26

我想从搜索框中搜索第二个元素时删除我的列表结果。我已经尝试了一些jquery代码，但我认为它不工作，因为我在错误的地方或错误的内容使用它。任何建议都将受到高度赞赏。下面是我的代码:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Kunde</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
    <script src="autocomplete/jquery.easy-autocomplete.min.js"></script>
    <link href="autocomplete/easy-autocomplete.min.css" rel="stylesheet" />

    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href="custom.css" rel="stylesheet" />
</head>
<body>
    <div class="container">
        <div class="jumbotron">

            <div class="col-lg-4">
                <input type="text" id="KUNDE" size="50" placeholder="Search by name." />
            </div>
            <div class="col-lg-2">
                <input class="btn btn-default" id="buton" type="submit" value="search" onclick="find();" />
            </div>
        </div>

        <ul id="list"></ul>
        <div class="footer"><p> © Copyright 2016</p> <strong><a href="http://rackpeople.com/">RackPeople</a></strong>.</div>
    </div>
    <script>
        $(function () {
            $("#KUNDE").focus();
        });
        $(document).keypress(function (e) {
            if (e.which == 13) {
                $("#buton").click();
            }
        });

        //$('#button').on('click', function () {
        //    $(root).empty();
        //});
        //$("li:eq(3)", $(root)).remove();
        //$('ul').eq(1).toggleClass('hidden');
        //$('#ul').empty();
        //$("#buton").click(function () {
        //    $("#list").remove();
        //});
        //$('#buton').on('click', '.itemDelete', function () {
        //    $(this).closest('li').remove();
        //});

        var uri = 'json.json';
        function find() {
            var info = $('#KUNDE').val();
            $.getJSON(uri)
                .done(function (data) {
                    var item = data.filter(function (obj) {

                        return obj.name === info || obj.ID === info;

                    })[0];
                    if (typeof item !== 'undefined' || item !== null) {
                        $("ul").append("<li>" + 'ID      = ' + item.ID, 'Name    = ' + item.name, "<br />" + 'Phone      = ' + item.phone, "<br />" + 'Contact       = ' + item.contact, "<br />" + 'BalanceLCY      = ' + item.balanceLCY, "<br />" + 'CreditLimitLCY       = ' + item.creditLimitLCY, "</li>")
                    }
                })
                .fail(function (jqXHR, textStatus, err) {
                    $('#RESULTS').text('Error: ' + err);
                });
        }
            var options = {
                url: "json.json",
                getValue: "name",

                list: {
                    match: {
                        enabled: true
                    }
                },
                theme: "square"
            };
        $("#KUNDE").easyAutocomplete(options);
    </script>
</body>
</html>

你有

    <input class="btn btn-default" id="buton" type="submit" value="search" onclick="find();" />

试

    <button type="button" id="buton">Click me</button>

和

    $("#buton").click(function () {
        $("#list").remove();
        //do more stuff
    });